vue项目首次引入elementUI报错

描述

本文参照官网

完整引入

在 main.js 中写入以下内容：

import Vue from 'vue'
import App from './App'
import router from './router'
Vue.config.productionTip = false

import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);
new Vue({
  el: '#app',
  router,
  components: { App },
  template: '<App/>'
})

以上代码便完成了 Element 的引入。需要注意的是，样式文件需要单独引入。

按需引入

借助 babel-plugin-component，我们可以只引入需要的组件，以达到减小项目体积的目的。

安装 babel-plugin-component：

在工程目录下,使用 npm 的方式安装，它能更好地和 webpack 打包工具配合使用。

npm install babel-plugin-component -D

安装完成后其文件会保存在项目下的node_modules目录下：