Vue.js 2.0 백엔드 시스템 실제 사례

이번에는 Vue.js 2.0 백엔드 시스템의 실제 사례를 가져오겠습니다. Vue.js 2.0 백엔드 시스템의 주의사항은 무엇인가요?

친구가 최근 자신의 기술을 연습하기 위해 OA를 만들고 싶어해서(PS, 그는 항상 사업을 시작하고 싶었습니다) 최근에 시간이 부족해서 같이 하자고 했습니다. 그가 스스로 사용할 프레임워크를 작성하도록 도와주세요.

저는 프로젝트를 관리하기 위해 원사를 사용합니다(실제로 추세를 따르지는 않습니다). 물론 Npm 관리도 사용할 수 있습니다

먼저 vue-cli를 사용하여 프로젝트를 초기화하고 Vue-router Vuex 요소를 설치합니다. 친구는 프런트 엔드를 해본 적이 없기 때문에 요소 페이지를 빠르게 개발하기를 선택했습니다. 모든 종속성을 설치한 후 디렉토리 구조는 다음과 같습니다 디렉토리 구조

여기서 주목해야 할 점은 각 구성 요소가 index.vue script.js style.sass template.jade 파일로 구성된 폴더이므로

editor

에서 포맷하면 편리합니다. quoting할 때 폴더만 인용하면 됩니다

e.g.
import NotFound from './views/404';
index.vue
<style lang="sass" scoped src="./style.sass"></style><template lang="jade" src="./template.pug"></template><script src="./script.js"></script>
script.js
export default {  data() {    return {    }  },  components: {  }}
sass
.red  color: red

vue-cli webpack으로 생성한 프로젝트는 jade를 사용하지 않기 때문에 jade-loader를 추가해야 합니다. of webpack을 직접

주의하세요 pug-html-loader jade

...
     {        test: /\.pug$/,
        loader: 'vue-html!pug-html'
      },
...

Sass support

를 설치해야 할 때 Sass를 지원하려면 sass-loader node-sass

Vue-

resource

를 설치해야 합니다. 설치했지만 아직 사용하기로 결정하지 않았습니다. Ajax를 사용한다면 reqwest 라이브러리를 사용하겠습니다여기서의 프로젝트는 vue2를 사용하여 단일 페이지 애플리케이션을 구축하는 가장 실용적인 프로세스를 나타냅니다. .0이므로 예제의 기능은 동일합니다~

github에 별표를 눌러주세요

이 글의 사례를 읽으신 후 방법을 마스터하셨다고 믿습니다. PHP 중국어 사이트의 다른 관련 글도 주목해주세요!

관련 자료:

BOM 작업에 대한 js 지식 모음

js 정규 표현식의 10가지 응용 예

위 내용은 Vue.js 2.0 백엔드 시스템 실제 사례의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!