最近工作比较忙,有一段时间没有写前端玩了。今天试着搭一个项目,发现各种坑,以前用起来非常好的配置文件各种报错。排查后发现原来巴别塔升级了一个大版本,已经到7.倍了,这里我总结一下升级过程中踩到的坑。
错误:找不到模块' @babel/核心”
babel-loader@8要求巴别塔7。x(包' @babel/核心”)。如果你想使用巴别塔6。x (“babel-core”),您应该安装“babel-loader@7”。
在Function.Module。_resolveFilename (module.js 547:15):
在Function.Module。_load (module.js 474:25):
在模块。要求(module.js 596:17):
需要(内部/module.js: 11:18)
....
没找到@babel/核心,需要把babel-core卸载掉,从新安装@babel/核心
npm联合国babel-core
npm i - d @babel/核心
错误。/src/index.jsx
(从模块构建失败了。/node_modules babel-loader/lib/index.js):
错误:插件/预置文件不允许出口对象>
npm:
——babel-preset-env
+ @babel/preset-env
——babel-preset-react
+ @babel/preset-react
——babel-preset-stage-0
.babelrc:
——“预设”:“反应”、“env”、“0阶段”、“mobx”)
+“预设”:[" @babel/preset-react”、“@babel/preset-env”、“mobx”)
之前
除了上述的预设,我还用了babel-preset-mobx
但是没找到@babel/preset-mobx,从babel-preset-mobx git提交日志上看,作者已经支持了最新的巴别塔。在之后的测试中,发现mobx的功能也能正常使用。
另外、舞台- *已弃用
错误。/src/index.jsx
(从模块构建失败了。/node_modules babel-loader/lib/index.js):
TypeError:这个。setDynamic不是一个函数
在PluginPass.pre
…
之前
这次是插件了,一样把babel-plugin - *卸载,重新安装@babel/插件- *
然后修改。babelrc文件
具体的包名可以在npm仓库里找
最终文件
.babelrc:
{
“预设”:“@babel/preset-env”、“@babel/preset-react”、“mobx”),
“插件”:(
“@babel/plugin-proposal-object-rest-spread”,
“@babel/plugin-transform-runtime”
]
}
package.json:
" devDependencies ": {
“@babel/核心”:“^ 7.1.0”,
:“@babel/plugin-proposal-object-rest-spread ^ 7.0.0”,
:“@babel/plugin-transform-runtime ^ 7.1.0”,
:“@babel/preset-env ^ 7.1.0”,
:“@babel/preset-react ^ 7.0.0”,
:“babel-loader ^ 8.0.2”
:“babel-preset-mobx ^ 2.0.0”,
…
}，
“依赖”:{
“@babel/运行时”:“^ 7.0.0”,
…
}
之前
这次升级,功能上有什么变化我就不在这里写了,大家可以自行搜索
总的来说,巴别塔舍弃了以前的巴别塔- * - *的命名方式,改成了@babel/* - *
修改依赖和。babelrc文件后就能正常启动项目了。
webpack不用修改(除非你是webpack 3。X升webpack 4. X)
上面的只是我遇到的问题,如果还有其他问题,可以参考资料升级指南升级到巴别塔7
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
