webpack中按需引入mint-UI報Error: .plugins[0][1] must be an object, false, or undefined

 

Mint-UI官方文檔：https://mint-ui.github.io/docs/#/en2/quickstart

按需引入mint-UI的步驟：

1. 安裝 npm install --save mint-ui
2. 安裝 npm install babel-plugin-component -D
3. 配置 .babelrc

{
  "presets": [
    ["@babel/preset-env", { "modules": false }]
  ],
  "plugins": [
    ["component",
        {
          "libraryName": "mint-ui",
          "style": true
        }
    ]
  ]
}

 

 

4. main.js中引入mint-UI

import { Button} from 'mint-ui'
Vue.component(Button.name, Button)


var vm = new Vue({
    el:"#app",
    render:c=>c(app)
});

 

 

5. App.vue中使用組件

<mt-button type="danger" size="normal"  icon='more'>danger</mt-button>

 

根據官網文檔配置 .babelrc時，報錯Error: .plugins[0][1] must be an object, false, or undefined，要去掉component后面的[]

 "plugins": [["component", [//去掉此處的[]，即可正常運行
    {
      "libraryName": "mint-ui",
      "style": true
    }
  ]]]


原創地址: https://blog.csdn.net/weixin_42869547/article/details/96727386