nuxt.js中按需加载 element-ui遇到的问题

1. 下载element-ui

npm i element-ui -S

2. 在～/plugins/下 新建一个名为 element-ui.js文件

import Vue from 'vue'
import {form, input, formItem, button, message} from "element-ui";
Vue.use(form);
Vue.use(formItem);
Vue.use(input);
Vue.use(button);

Vue.prototype.$message = message;

3. 在～/nuxt.config.js中加入此：

plugins: [
        {src: '@/plugins/element-ui', ssr: true},
    ],
build: {
	// 按需引入element-ui的css等组件文件
    extractCSS: true,
    vendor: ['element-ui'],
    productionSourceMap: false,
    productionGzip: true,
    productionGzipExtensions: ['js', 'css', 'svg'],
    babel: {
        plugins: [
            ["component", {"libraryName": "element-ui", "styleLibraryName": "theme-chalk"}]
        ]
    },
}

ok ,开心使用

注意点：

1. 在element-ui.js中引入 message的时候：

import Vue from 'vue'
import {message} from "element-ui";
Vue.prototype.$message = message;

2. 按需加载element-ui的时候需要babel,

出错的话再安装（ps:我的有时候出错）

npm install babel-plugin-component -D