为什么速记分配在我的 babel 设置中不起作用?

Question

Background

我目前正在通过 babel 将项目的后端迁移到 ES6，并且遇到了一个错误，该错误似乎与不再起作用的速记作业有关？我不熟悉通天塔。可能是我在这里没有看到一些非常明显的东西。

问题

现在，当尝试通过yarn start在 dev 中运行我的应用程序时，我看到以下错误(简化示例)，这在设置 babel 之前确实有效(我在node.js 13.13.0上)。知道这里发生了什么吗？

代码片段：

const a = {
hi:1, bye:2, ciao: 3
}
const b  = {hi, bye} = a
console.log(b)

错误消息：

[nodemon] restarting due to changes...
[nodemon] starting `NODE_ENV=development babel-node server.js server.js`
/Users/user/Projects/fb/fb-flow-app/server/config/config.js:21
var b = (_a = a, hi = _a.hi, bye = _a.bye, _a);
^
ReferenceError: hi is not defined
at Object.<anonymous> (/Users/user/Projects/fb/fb-flow-app/server/config/config.js:12:8)
at Module._compile (internal/modules/cjs/loader.js:1123:30)
at Module._compile (/Users/user/Projects/fb/fb-flow-app/server/node_modules/pirates/lib/index.js:99:24)
at Module._extensions..js (internal/modules/cjs/loader.js:1143:10)
at Object.newLoader [as .js] (/Users/user/Projects/fb/fb-flow-app/server/node_modules/pirates/lib/index.js:104:7)
at Module.load (internal/modules/cjs/loader.js:972:32)
at Function.Module._load (internal/modules/cjs/loader.js:872:14)
at Module.require (internal/modules/cjs/loader.js:1012:19)
at require (internal/modules/cjs/helpers.js:72:18)
at Object.<anonymous> (/Users/user/Projects/fb/fb-flow-app/server/server.js:1:14)
[nodemon] app crashed - waiting for file changes before starting...

高级项目结构：

root
|-frontend
|-server

前端是一个next.js项目，有自己的.babelrc似乎正在工作。

迄今采取的步骤

我已经安装了几个 babel-dev-依赖项(在我的服务器文件夹中)：

"devDependencies": {
"@babel/cli": "^7.10.1",
"@babel/core": "^7.10.2",
"@babel/node": "^7.10.1",
"@babel/preset-env": "^7.10.2",
...
}

并且还尝试过(没有结果)

@babel/plugin-transform-shorthand-properties
@babel/plugin-transform-spread

我已经配置了我的nodemon.json：

{
"watch": ["../server"],
"exec": "NODE_ENV=development babel-node server.js",
"ext": "js"
}

我已经设置了一个.babelrc

{
"presets": ["@babel/preset-env"]
}

然后我通过以下方式运行：

"scripts": {
"start": "concurrently --prefix none "cd server && NODE_ENV=development yarn nodemon server.js" "cd frontend && yarn dev""
},

Answer 1

当您执行以下操作时：

const a = {
hi:1, bye:2, ciao: 3
}
const b  = {hi, bye} = a

Babel 看到了两个变量的赋值，分别名为hi和尚不存在的bye。似乎 Babel 在严格模式下运行，这是一个错误。在严格模式下，您将在 Node 中获得相同的结果。通过显式定义它们来解决此问题：

const a = {
hi:1, bye:2, ciao: 3
}
let hi, bye;
const b  = {hi, bye} = a

解构不会创建对象，尽管它看起来像对象初始化。

请注意，正因为如此，b的值不是一个看起来像{hi:1, bye:2}的对象，而是对a的引用，就像你只做const b = a会发生什么：

const b = a;
a.hi = 5;
console.log(b.hi); // 5

您可以执行的其他操作：

• const {hi, bye} = a;获取名为hi和bye的两个常量变量(而不是var或let)
• const {hi: b, bye: c} = a;获取名为b和c("重命名")
• const {hi, bye} = a; const b = {hi, bye};在变量b中只用这两个键创建一个对象，但这也会创建变量hi和bye。