在 Nuxt.js 中手动安装使用 element-ui 的方法

有以下三个步骤:


  1. 在项目中安装 element-ui


npm i element-ui -save    // 官方指定安装方法

 

  2.在 plugins 文件夹下新建 element-ui.js 文件,只需三行


import Vue from 'vue'
import Element from 'element-ui'
Vue.use(Element);

 

3.配置 nuxu.config.js (重点)

module.exports = {
  ...
  /*
  ** Global CSS
  */
  css: [
    {src:'element-ui/lib/theme-chalk/index.css'}    // 1.在 css 中配置 element-ui 的 css 位置
  ],
  /*
  ** Plugins to load before mounting the App
  */
  plugins: [
    {src:'~plugins/element-ui', ssr: false}    // 2.在 plugins 中配置刚刚创建好的 plugin
  ],
  /*
  ** Build configuration
  */
  build: {
    ...
    vendor: ['element-ui']    // 3.此处配置 build 时带着element-ui
  }
}

 

*配置好 nuxt.config.js 后需要重启项目生效。



相关推荐

评论