解决[BABEL] Note: The code generator has deoptimised the styling of xxx.js as it exceeds the max of

解决[BABEL] Note: The code generator has deoptimised the styling of xxx.js as it exceeds the max of 500KB

问题根源:

  •  babel默认情况下限制编译文件大小为500kb,超过500kb就会报以下错误

解决方案:

  •  其实把限制关掉即可,如下:

     在项目根目录中找到babel.config.js 里边配置compact:false即可,若无babel.config.js创建一个就行。

在 Vue3 中引入 lodash 报这个错误通常是因为你的配置文件没有正确设置处理 esm 模块的额外加载器,因为 lodash 已经从 CommonJS 转换为了 ES 模块。解决这个问题需要按照以下步骤操作: 1. **安装 `@vue/babel-plugin-import`**: 确保你在 `package.json` 的 `devDependencies` 部分已经安装了这个插件,如果没有,运行: ``` npm install --save-dev @vue/babel-plugin-import ``` 2. **修改 `.babelrc.js` 或者 `babel.config.js`**: 将 `@vue/babel-preset-app` 替换为包含 `import` 插件的配置,添加如下内容: ```javascript // .babelrc.jsbabel.config.js { plugins: [ ['@vue/babel-plugin-import', { 'libraryName': 'lodash', 'libraryDirectory': 'es' }], // 如果 lodash 存放于 es 目录下 // 或者 ['@vue/babel-plugin-import', { 'libraryName': 'lodash-es' }] // 如果直接导入 lodash-es ] } ``` 3. **检查是否还需要其他loader**: 根据你的构建工具(如 Webpack),你可能需要添加一个支持 ES 模块的 loader,比如 `@webpack-contrib/esm-loader` 或者在 Vue CLI 3.x 及以上版本中默认已启用的 `esm-loader`。 4. **重启项目**: 保存并关闭所有打开的编辑器,然后通过命令行 `npm run serve` 或者 `yarn serve` 重启你的 Vue 应用。 如果按照上述步骤仍然无法解决问题,可能需要查看具体的错误信息以获取更详细的提示,因为有时候可能是其他冲突或配置错误导致的。记得检查是否有其他同时使用的 loader 造成冲突。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值