Skip to content

Instantly share code, notes, and snippets.

@Justineo
Last active September 19, 2018 14:10
Show Gist options
  • Save Justineo/786a0ddb2d938007435fcd6952214d80 to your computer and use it in GitHub Desktop.
Save Justineo/786a0ddb2d938007435fcd6952214d80 to your computer and use it in GitHub Desktop.
Vue CLI 3 配置 VEUI

安装:

npm i --save veui veui-theme-one
npm i --save-dev veui-loader babel-plugin-veui babel-plugin-lodash

创建 vue.config.js

const lessOptions = {
  javascriptEnabled: true
}

module.exports = {
  transpileDependencies: [
    /\/node_modules\/veui\//,
    /\/node_modules\/vue-awesome\//,
    /\/node_modules\/resize-detector\//
  ],
  chainWebpack: config => {
    config.module
      .rule('veui')
      .test(/\.vue$/)
      .pre()
      .use('veui-loader')
      .loader('veui-loader')
      .tap(() => {
        return {
          modules: [
            {
              package: 'veui-theme-one',
              fileName: '${module}.less'
            },
            {
              package: 'veui-theme-one',
              fileName: '${module}.js',
              transform: false
            }
          ]
        }
      })

    const types = ['vue-modules', 'vue', 'normal-modules', 'normal']
    types.forEach(type => {
      config.module
        .rule('less')
        .oneOf(type)
        .use('less-loader')
        .tap(options => Object.assign({}, options, lessOptions))
    })
  }
}

修改 babel.config.js

module.exports = {
  presets: [
    '@vue/app'
  ],
  plugins: [
    'veui',
    'lodash'
  ]
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment