使用ElementUI组件库,按需引入ElementUI,按照官方文档的代码配置会遇到的报错问题,Error: Cannot find module ‘babel-plugin-component‘

问题: Error: Cannot find module 'babel-plugin-component’
使用ElementUI组件库,按需引入ElementUI,按照官方文档的代码配置会遇到的报错问题!!
原因: 官方文档没及时更新
babel-plugin-import 是一款 babel 插件,它会在编译过程中将 import 的写法自动转换为按需引入的方式。
最新版本安装后,没有.babelrc文件,而是有babel.config.js文件,按需引入时需要到babel.config.js文件里去配置
在这里插入图片描述

解决方案:

  1. 将下面代码复制到babel.config.js文件,
  2. 保存,npm run serve重启服务器即可,
  3. 如用到多个组件库,只需要复制配置信息追加到plugins里,
    !注意presets的信息不要修改,即使使用多个组件库也是这一句代码
module.exports = {
    
    
  presets: [
    '@vue/cli-plugin-babel/preset',
  ],
  plugins: [
    [
      "component",
      {
    
    
        "libraryName": "element-ui",
        "styleLibraryName": "theme-chalk"
      }
    ]
  ]
}

猜你喜欢

转载自blog.csdn.net/wangdekai007/article/details/109165853