Nuxt.js 整合 ElementUI_综合

参考:https://element.eleme.cn/#/zh-CN/component/installation

安装ElementUI，命令行进入项目根路径执行：

npm i element-ui -S

安装成功后查看package.json是否有相关依赖配置
2. 以插件方式引入ElementUI：创建plugins/element-ui.js

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

在nuxt.config.js内配置css,plugins,build如下：

 /*** 引入全局样式*/css: ['element-ui/lib/theme-chalk/index.css','element-ui/lib/theme-chalk/display.css',//引用主题样式'@/assets/theme/index.css','@/assets/css/global.css',//加上mavon-editor插件'mavon-editor/dist/css/index.css'],/*** Plugins to load before mounting the App*/plugins: ['@/plugins/element-ui.js','@/plugins/interceptor.js','@/plugins/mavon-editor.js','@api/article.js','@api/question.js','@api/common.js','@api/user.js',//指定只在客户端使用{
    src: '~/plugins/mavon-editor.js', mode: 'client'},],/*** Nuxt.js dev-modules*/buildModules: [],/*** Build configuration*/build: {
    /*** 打包的时候将 位于 node_modules 目录下的 element-ui 一起导出*/transpile: [/^element-ui/],/*** webpack 自定义配置* @param config* @param ctx*/extend(config, ctx) {
    }}

重启项目

npm run dev