javascript - 使用 Babel 7.10 编译成模块 js 文件而不导入

Question

tl;dr:如何在全栈节点应用程序中使用 babel 7.10 作为前端 js 文件的完整初学者？

我正在尝试使用最新版本的 Babel (7.10.5) 来编译我网站的 JS 文件，这是我第一次使用 Babel。由于 babel 的文档似乎没有完全更新或者因为我太笨了。

我只生成带有浏览器不理解的“require”或者浏览器看不到的一些 babel 文件的“导入”的 JS 文件。

我不知道我应该做什么，我已经尝试使用 babel.config.json 文件以及 .babelrc 文件。我安装和卸载了各种软件包和插件等等，但似乎没有任何效果。

我不关心模块大小或任何高级的东西，我只希望我用 es6 编写的简单网站可以在所有浏览器中运行，基本上使用 es5。我知道我需要 @babel/cli @babel/core 和 @babel/preset-env 并且我需要某种配置文件然后我想通过命令行运行它。最简单的方法是什么？

附带说明一下，我没有使用任何框架，只是普通的老式 JavaScript

如果这个问题 super 愚蠢或者问得不好，我深表歉意。我不能显示任何代码，因为我没有

Answer 1

1、安装依赖:

npm i @babel/cli @babel/core @babel/preset-env

2、添加.babelrc:

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

3、编辑package.json，在本例中，确保所有源文件都在“src”目录下

//package.json
{
  "scripts": {
    "build": "babel src --out-dir dist"
  },

4、运行脚本，生成的文件会在“dist”目录下

npm run build