我的 Node.js 设置（Mocha 和 Chai、Babel7、ES6）

每次我想编写代码时，我都会尝试为我的项目构建一个合适的开发环境。我通常会安装 Babel 来将 ES6/ES7 编译回 ES5，安装 Mocha 和 Chai 进行单元测试，以及安装 Nodemon 来自动重启应用程序。

因此，我决定分享我从零开始搭建 Node 环境的经验。希望这些信息对您有所帮助。

首先，让我们为我们的项目生成一个空的 package.json。

npm init -y

现在，我们可以添加一些开发依赖项。

npm install --save-dev @babel/cli @babel/core @babel/node @babel/register @babel/preset-env chai mocha nodemon

安装后我们的 package.json 应该如下所示：

Babel 7 包现在有“范围”，因此旧的 babel-cli 变成了@babel /cli。

ES6 和 Node

创建一个 index.js 文件，其中包含一个返回字符串的简单函数，以便我们测试所有内容是否正确。我总是将 index 文件放在 src 文件夹的根目录下。如果您将它放在其他位置，请记得相应地调整 package.json 脚本中的路径。

./src/index.js

const sayHello = _ => "Hello guys!"

console.log(sayHello())

要查看结果，请将以下脚本复制并粘贴到您的 package.json 中。

"start": "nodemon ./src/index.js",

在控制台/终端中输入 npm start 后，您将看到如下内容：

Nodemon 会监控代码中的每个更改，并在您进行任何更改时自动重新启动应用程序。将 ES6 导出语句添加到 index.js 文件的末尾，然后再次运行该应用程序。

export default sayHello

结果是：

Node 无法识别 ES6 的 export/import 关键字。为了解决这个问题，我们需要使用 Babel 将 export default sayHello 编译成类似 exports.default = sayHello 的形式。

为此，我们需要在项目根目录中创建一个名为 .babelrc 的文件。将以下代码复制并粘贴到该文件中。

{

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

}

接下来，我们还需要调整我们的启动脚本。

"start": "nodemon --exec babel-node ./src/index.js"

测试

好的，我们来写个快速测试看看它是否有效。记住，我们已经安装了 chai 和 mocha，所以无需任何进一步的配置就可以使用它们。

./测试/index.spec.js

import { expect } from "chai"
import sayHello from "../src/index"

describe("index test", () => {
    describe("sayHello function", () => {
        it("should say Hello guys!", () => {

            const str = sayHello();
            expect(str).to.equal("Hello guys!")
        })
    })
})

此外，我们需要在 package.json 中添加一个测试脚本：

"test": "./node_modules/.bin/mocha --compilers js:@babel/register"

关于测试脚本的三个重要事实：

• 如果您使用 npm install -g 全局安装 mocha，则可以改用“mocha --compilers js: @babel /register”。
• 由于我们的测试文件位于测试文件夹中，mocha 会自动找到我们的 index.spec.js。
• --compilers js: @babel /register 告诉 mocha 我们使用的是 ES6，所以它应该处理它。这就是我们安装@babel /register 的原因。

在您的控制台/终端中输入 npm test，您将看到测试通过。

编译到 Dist 文件夹

如果您好奇编译后的 ES5 兼容代码是什么样子，您可以将以下脚本添加到您的 package.json 中。

"build": "babel src --out-dir ./dist --source-maps",

"serve": "node ./dist/index.js",

npm run build 命令会在 dist 文件夹中创建一个已编译的 index.js 文件，npm run serve 命令会运行该文件，而不是 src 文件夹中的原始文件。我们还使用了 --source-maps 选项，以便在调试 ./dist/index.js 时可以看到我们编写的实际 ES6 代码。

调试

我是一名 JS 开发人员，因此我宁愿使用浏览器而不是 IDE 来调试我的代码。

幸运的是，Node.js 允许我们在浏览器中调试应用程序。这是另一个用于 package.json 的脚本。

"debug": "node --inspect-brk ./dist/index.js"

npm run debug 之后您可以看到以下消息。

将为您生成的突出显示的字符串附加到此 url：chrome-devtools://devtools/bundled/inspector.html?experiments=true&v8only=true&ws=127.0.0.1:9229/。

然后，将其粘贴到浏览器就完成了。

结束

就这样吧。下次，我会深入探讨一些有趣的 JS/Python/Rust 编程概念。

如果您遇到困难或者知道更好的方法，请随时发表评论。

感谢阅读。欢迎从此处克隆代码仓库。