laravel 5.4+vue+vux+element 의 환경 배합 과정 소개

머리말
요즘 은 프로젝트 의 수요 때문에 이런 환경 을 맞 춰 야 한다.전에 만 든 물건 을 이렇게 써 본 적 이 없어 서 인터넷 에서 한참 을 찾 았 는데 너무 간단 하지 않 으 면 전혀 통 하지 않 는 다.자신 이 한참 동안 구 덩이 를 밟 아서 마침내 조합 에 성공 했다.
과정 은 다음 과 같다.
먼저 laravel 5.4 를 다운로드 하고 홈 페이지 에 가서 패키지 나 coposer 또는 비계 를 원 클릭 으로 다운로드 하 셔 도 됩 니 다.한 마디 로 하면 현재 laravel 환경 에 접근 할 수 있 습 니 다.
laravel 의 package.json 파일 열기:

"private": true,
 "scripts": {
 "dev": "npm run development",
 "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
 "watch": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
 "watch-poll": "npm run watch -- --watch-poll",
 "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
 "prod": "npm run production",
 "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
 },
 "devDependencies": {
 "axios": "^0.15.3",
 "bootstrap-sass": "^3.3.7",
 "cross-env": "^3.2.3",
 "jquery": "^3.1.1",
 "laravel-mix": "0.*",
 "lodash": "^4.17.4",
 "vue": "^2.1.10"
 }
}

빨간색 부분 을 다음 으로 변경 합 니 다.

"devDependencies": {
 "axios": "^0.15.3",
 "bootstrap-sass": "^3.3.7",
 "jquery": "^3.1.1",
 "laravel-mix": "^0.8.3",
 "cross-env": "^3.2.3",
 "lodash": "^4.17.4",
 "vue": "^2.1.10",
 "element-ui": "^1.2.8",
 "vue-loader": "^11.3.4",
 "vue-router": "^2.4.0"
}

이후 터미널 은 프로젝트 루트 디 렉 터 리 에 들 어가 실행 합 니 다.

cnpm install

타 오 바 오 미 러 가 없 으 면:

npm install //  ：(window           --no-bin-links)。

한 가지 주의해 야 할 것 은 위의 package.json 파일 에 각 의존 라 이브 러 리 를 설정 할 때 구체 적 인 버 전에 따라 스스로 수정 해 야 합 니 다.그렇지 않 으 면 많은 구 덩이 를 밟 을 수 있 습 니 다.(왜 알 고 있 는 지 묻 지 마 세 요!~)
그 후에 우 리 는 laravel 프로젝트 다음 에 디 렉 터 리 가 하나 더 있 는 것 을 발견 할 수 있 습 니 다.
 
이 럴 때 는 이미npm run dev하지만 laravel 자체 페이지 입 니 다.
지금까지 vue,vue-loader,vue-router,element-ui 를 설 치 했 습 니 다.이제 vux 를 설치 할 때 가 되 었 습 니 다!
cd 프로젝트 의 루트 디 렉 터 리 에 vue-cli 비계 가 필요 합 니 다.아직 설치 되 지 않 았 다 면:

npm install vue-cli -g / cnpm install vue-cli -g

다음 설치 vux:

npm install vux --save

응,사실 빨 라~~
vux 2 는 vux-loader 가 필요 하기 때문에 vux-loader 를 설치 해 야 합 니 다.

npm install vux-loader --save

less-loader 를 설치 하여 less 소스 코드 를 정확하게 컴 파일 합 니 다:

npm install less less-loader C-save

OK,설치 성공 후 sell 은 프로젝트 루트 디 렉 터 리 에 들 어가 웹 팩.config.js 라 는 새 파일 을 만 들 고 그 안에 설정 합 니 다.

루트 디 렉 터 리 에 있 는 package.json 수정-config 가 가리 키 는 파일 을 엽 니 다.현재 웹 팩.config.js 파일 을 가리 키 고 있 습 니 다.

저장,설정 완료 후 실행:

npm run watch

총결산
이상 은 이 글 의 전체 내용 입 니 다.본 논문 의 내용 이 여러분 의 학습 이나 업무 에 어느 정도 참고 학습 가치 가 있 기 를 바 랍 니 다.궁금 한 점 이 있 으 시 면 댓 글 을 남 겨 주 셔 서 저희 에 대한 지지 에 감 사 드 립 니 다.