最清晰简单的 Nuxt.js 使用 element-ui 教程

请完成以下三个步骤：

 

1.在项目中安装 element-ui

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

 

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 后需要重启项目生效。