一杯咖啡,一盏灯

一串代码,一本书

解决vue import 导入 umd 模块报错的问题

基于开发npm组件库时用vue-cli 3.x的脚手架

解决 import 导入 umd 模块报错的问题

vue-cli-service build --target lib --name index [entry]
可以直接构建npm包,npm publish后再通过npm install [name]安装引用一点问题都没有
但是如果是直接在本地引入

import Ea from '../lib/index.umd.js';
没有进行额外配置不出意外是会报错的

解决方案如下:

这里需要用到 @babel/plugin-transform-modules-umd

npm install --save-dev @babel/plugin-transform-modules-umd
然后在babel.config.js添加这个plugin

  presets: [
    '@vue/cli-plugin-babel/preset',
  ],
  plugins: ['@babel/plugin-transform-modules-umd'], //添加这行
};

好了,终于不用每次构建都npm publish生成许多无意义version去实测了

posted @ 2022-09-07 16:31  Adam浩淼  阅读(2938)  评论(0)    收藏  举报