关于javascript:vuecli3按需引用elementUI

1、装置element-ui
npm i element-ui -S

2、依据官网中的按需引入的介绍,装置babel-plugin-component后,

npm install babel-plugin-component -D

3、官网介绍的是,批改.babelrc为

{
  "presets": [["es2015", { "modules": false }]],
  "plugins": [
    [
      "component",
      {
        "libraryName": "element-ui",
        "styleLibraryName": "theme-chalk"
      }
    ]
  ]
}

但vue-cli3中没有.babelrc,其实在balel.config.js中批改就好。但间接把下面的复制粘贴到balel.config.js中,会保错,批改为如下即可

{
  presets: ["@vue/app"],
  plugins: [
    [
        'component',
        {
            libraryName: 'element-ui',
            styleLibraryName: 'theme-chalk'
        }
    ]
  ]
}

4、在main.js中按需引入

import Vue from 'vue';
import { Cascader } from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css'
import App from './App.vue';

Vue.component(Cascader.name, Cascader)
// Vue.use(Cascader)

new Vue({
  el: '#app',
  render: h => h(App)
});

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理