vue-cli项目引入vux步骤及遇到的坑

vue-cli项目创建成功之后，开始引入vux

• 1.安装vux

npm install vux --save

• 2.安装vux-loader

npm install vux-loader --save-dev

• 3.安装less

npm install less --save-dev

• 4.安装less-loader

npm install less-loader --save-dev

• 5.安装vue-loader

npm install vue-loader --save-dev

• 6.安装yaml-loader

npm install yaml-loader --save-dev

• 7.在vue.config.js中进行相关配置，如果没有vue.config.js则在很目录创建此文件

module.exports = {
    configureWebpack: config => {
        require('vux-loader').merge(config, {
            options: {},
            plugins: [{
                name: 'vux-ui' 
            },
            {
                name: 'duplicate-style'
            },
            { 
                name: 'less-theme', 
                path: 'src/style/theme-expand.less'
            }
            ]
        })
    }
}

• 8.配置build/webpack.base.conf.js参考vux官网
  在build/webpack.base.conf.js最后添加

const vuxLoader = require('vux-loader')
const webpackConfig = originalConfig // 原来的 module.exports 代码赋值给变量 webpackConfig

module.exports = vuxLoader.merge(webpackConfig, {
  plugins: ['vux-ui']
})

• 9.安装vuex-i18n（如果没安装会报错，项目无法运行）

npm install vuex-i18n

现在可以正常运行项目了