解决不了的难题之@babel/register

问题出现

我在用vue创建项目的时候想用nodejs模拟个后台假数据，nodejs里要支持es6的语法需要使用@babel/register，安装完这个包的版本是7.5.5。然后调用

1	require("@babel/register");

出错

基本意思是找不到 core-js/modules/es6.regexp.constructor

问题分析

去 @babel/register 全局搜索也没有这行可疑代码

去 package-lock.json 查到使用的core-js为版本3，其他地方都是2，肯定错误就出现在这里

core-js

按照常规经验应该降低@babel/register的版本就可以了，在github查到使用最后使用core-js@2版本的为7.3.4，npmjs 官网是7.0.0

1 2	https://github.com/babel/babel/blob/v7.3.4/packages/babel-register/package.json https://www.npmjs.com/package/@babel/register/v/7.0.0

这里我绕了一些弯路，我卸载755版本，安装700版本，可是package-lock.json包就是不会更新@babel/register下的core-js为2版本，删除node_modules重新装也不行，后来想到清缓存

1	npm cache clean --force

总算把700的包成功安装了，@babel/register下的core-js版本也变为2.5.7

core-js

这回应该奇迹出来了吧，失败，还是报图1的错

找es6.regexp.constructor

再去core-js的github

1 2	https://github.com/zloirock/core-js/tree/v2/modules 有es6.regexp.constructor https://github.com/zloirock/core-js/tree/v3/packages/core-js/modules 有es.regexp.constructor

可以看出，3版本不仅改了项目结构，还tm重命名了，降成2是必然的了，至于已经降了为什么不生效呢？？

总结

~~花了3天时间，依然没有解决~~

n天后看vue-element-admin 发现有如下注释说明，原来动态导入需要配置 VUE_CLI_BABEL_TRANSPILE_MODULES=true

https://github.com/vuejs/vue-cli/blob/dev/packages/@vue/babel-preset-app/index.js

Vue CLI使用VUE_CLI_BABEL_TRANSPILE_MODULES环境变量来控制是否启用Babel插件动态导入节点插件

它只通过将所有import（）转换为require（）来完成一件事

当你有大量的页面时这种配置可以显著提高热更新的速度