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

标签 javascript babeljs

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 愚蠢或者问得不好,我深表歉意。我不能显示任何代码,因为我没有

最佳答案

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

关于javascript - 使用 Babel 7.10 编译成模块 js 文件而不导入,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/63089012/

相关文章:

javascript - 在 Vue.js 中使用 HTML Canvas 时遇到问题

php - 计算固定 map 大小和动态对象位置的比例因子

javascript - 当 Firebug 运行时,jQuery 在 Firefox 中工作,当 Firebug 未运行时,jQuery 不起作用

javascript - SyntaxError : react-table/src/publicUtils. js:当前未启用对实验语法 'jsx' 的支持

babeljs - 我在使用 babel 为生产构建 Angular 应用程序时遇到问题

javascript - 当输入单选被选中时显示文本区域

javascript - jQuery 如何用同一个元素替换多个元素?

javascript - Jest 路径映射错误 : Could not locate module xyz mapped as: abc

javascript - 函数装饰器

javascript - React JS 未捕获引用错误 : require is not defined