view-design / ViewUI

A high quality UI Toolkit built on Vue.js 2.0
https://www.iviewui.com/
Other
2.65k stars 797 forks source link

How to use Import on Demand #177

Open murilolivorato opened 4 years ago

murilolivorato commented 4 years ago

Hello , I am trying to import just the Select component like this -

import { Select } from 'view-design';
import 'view-design/dist/styles/iview.css';

import { locale } from 'view-design';
import lang from 'view-design/dist/locale/pt-BR';
locale(lang);

Vue.use(Select);

I installed the babel plugin import with this command -

babel-plugin-import

BUT I DONT KNOW HOW TO CONFIG THE .babelrc.js FILE .

it IS LIKE THIS IN THE EXAMPLE -

{
  "plugins": [["import", {
    "libraryName": "view-design",
    "libraryDirectory": "src/components"
  }]]
}

How do I config it ?

hezhengxu2018 commented 4 years ago

I think your config is right but you should use Vue.component(Select) instead of Vue.use(Select).However,after I import babel-plugin-import ,my website became blank in IE,and I don't know why

hezhengxu2018 commented 4 years ago

https://github.com/iview/iview/issues/2747 this solution works! I hope it can help you

chainWebpack: config => { config.module .rule('view-design') .test(/view-design.src.*?js$/) .use('babel') .loader('babel-loader') .end() return config }