因为公司需要做一个webapp,所以我研究了两天决定使用vue全家桶+vux来开发,第一步搭建环境就遇到一些坑,我来捋一捋搭建步骤,让大家避免报错等问题。
这里假设你已经安装好了vue环境。
1. 在项目里安装vux
$ npm install vux --save
2. 安装vux-loader (这个vux文档似乎没介绍,当初没安装结果报了一堆错误)
$ npm install vux-loader --save-dev
3. 安装less-loader (这个是用以正确编译less源码,否则会出现 ' Cannot GET / ')
$ npm install less less-loader --save-dev
4. 在build/webpack.base.conf.js 文件进行配置(重点)
官网中的代码:
const vuxLoader = require('vux-loader')
const webpackConfig = originalConfig // 原来的 module.exports 代码赋值给变量 webpackConfig
module.exports = vuxLoader.merge(webpackConfig, {
plugins: ['vux-ui']
})
但你复制进去会发现,有两个相同的module.exports.我先现在需要做的就是先将原有的
module.exports = {
改为
var originalConfig = {
然后将上面的官网中代码放到底部去,这样就不会报 originalConfig not find了.
最后npm run dev再跑一下就没问题了。
网友评论