使用package.json测试babel-preset-env是否生效的技术问询

嘿，我来帮你一步步验证你的babel-preset-env配置是不是正常生效哈！你的基础安装和配置看起来没问题，但测试脚本还缺了关键的结果输出环节，我给你梳理下完整的验证流程：

1. 完善测试脚本，让结果看得见 #

你当前的脚本只是完成了转译操作，但没把转译后的代码输出出来，自然没法判断是否生效。修改成下面这样：

const fs = require('fs');

fs.readFile('my.js', 'utf8', (err, data) => {
  if (err) throw err;
  const babel = require("babel-core");
  const result = babel.transform(data).code;
  
  // 直接在控制台打印转译结果
  console.log('✅ 转译后的代码：');
  console.log(result);
  
  // 也可以写入文件方便对比查看
  fs.writeFile('my-transpiled.js', result, (writeErr) => {
    if (writeErr) throw writeErr;
    console.log('✅ 转译后的代码已保存到 my-transpiled.js 文件');
  });
});

2. 准备明确的测试代码 #

在my.js里写清楚要测试的ES6+语法（比如你提到的箭头函数），示例如下：

// my.js
const testArrowFunc = () => {
  console.log('这是箭头函数测试');
};

testArrowFunc();

3. 运行脚本查看结果 #

在终端里执行你的测试脚本（假设脚本名叫test-babel.js）：

node test-babel.js

4. 判断是否生效的关键依据 #

因为你配置的目标浏览器是IE >= 8，而IE8完全不支持箭头函数和const，所以正常转译后的代码应该满足：

• 箭头函数被转换成普通的function声明
• const被替换成var（babel-preset-env会根据目标环境自动适配）

转译后的代码大概会是这个样子：

var testArrowFunc = function testArrowFunc() {
  console.log('这是箭头函数测试');
};

testArrowFunc();

如果看到类似的输出，就说明你的babel-preset-env已经正常工作啦！

额外的快捷小技巧 #

要是觉得手动写测试脚本太麻烦，可以直接安装babel-cli工具简化操作：

yarn add --dev babel-cli

然后在终端直接执行转译命令，一步到位：

babel my.js --out-file my-transpiled.js

打开生成的my-transpiled.js就能直接看结果了～

内容的提问来源于stack exchange，提问作者user3496136