laravel 5.4 vue vux元素环境匹配过程介绍

前言

最近由于项目的需要，需要匹配这样的环境。我以前做过的东西都没用过。要么太简单，要么长时间网上找不到。我踩了很久的坑，终于匹配成功了。

流程如下

先下载laravel5.4，直接去官网下载一键安装包或composer或scaffold。简而言之，现在可以访问laravel环境。

在laravel中打开package.json文件：

private': true，' scripts ' : { ' dev ' : ' NPM run development '，' development ' : ' cross-env node _ env=development node _ modules/web pack/bin/web pack . js-progress-hide-modules-config=node _ modules/laravel-mix/setup/web pack . config . js '，' watch ' : ' cross-env node _ env=developments/web pack/bin/web pack . js-watch-progress-progress*、' 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' 3360' 4.17.4 '，' vue' :' 2.1.10 '，' element-ui' :' 1.2.2

Cnpm安装如果没有淘宝镜像，可以：

Npm install //(注意：在window下运行此命令时，应该带-no-bin-link)。有一点需要注意的是，在配置上述package.json文件中的各个依赖库时，要根据具体版本进行修改，否则会踩多坑(别问我为什么知道！~)

之后，我们可以发现laravel项目下还会有一个目录：

此时，NPM可以运行dev，但它仍然是laravel自己的页面。

到目前为止，我们已经配置了vue、vue-loader、vue-router和element-ui，现在是时候安装vux了！

Cd到项目的根目录，我们需要vue-cli脚手架，如果没有安装的话：

Vux是在NPM安装vue-CLI-g/cnpm安装vue-CLI-g之后安装的；

Npm安装vux -保存的不错，其实挺快的~ ~

由于vux2需要vux-loader使用，我们还需要安装vux-loader:

NPM install vux-loader-save install less-loader正确编译less源代码：

NPM installless-loader-saveok，安装成功后，sell进入项目根目录，创建一个名为webpack.config.js的新文件，并配置：

然后打开根目录下的package.json修改—config指向的文件，指向当前的webpack.config.js文件：

保存，配置完成后，执行：

npm运行监视摘要

以上就是本文的全部内容。希望本文的内容对大家的学习或工作有一定的参考价值。有问题可以留言交流。谢谢你的支持。