问题标签 [babeljs]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
498 浏览

abstract-syntax-tree - 如何将 ES6 AST 直接转化为 ES5 AST?

我了解到像 Babel 这样的包可以在 ES5 中完成将 ES6 代码转换为 JavaScript 的工作,但是我可以从某个地方的 ES6 AST 开始吗?

0 投票
2 回答
87645 浏览

javascript - 使用 ES6 (Babel) 导出一个类

我正在使用 ECMAScript 6 编写一些前端代码(使用 BabelJS 进行编译,然后使用 Browserify 进行浏览),以便我可以在一个文件中拥有一个类,将其导出并导入另一个文件。

我这样做的方式是:

然后在导入我所做的类的文件上:

然后我用 编译它grunt,这是我的Gruntfile

但是,在new Game(通话中,我收到以下错误:

因此,我所做的是分析 Babel 和 Browserify 生成的代码,我在以下位置找到了这一行PlayState_browserified.js

我决定打印require输出:

它只是一个空的对象。我决定检查pentagine_browserified.js文件:

似乎它正在正确导出类,但由于某些其他原因,其他文件不需要它。

另外,我确定该文件是正确需要的,因为更改字符串"../../lib/pentagine_browserified.js"会产生Not Found错误,因此我确定它是正确的文件。

0 投票
4 回答
7281 浏览

node.js - ES6 方法得到一个空的“this”并且类变量是不可访问的

我正在使用 ES6 类在 Node.js 中将一些功能捆绑在一起。这是(基本上)它的样子:

我认为对于 ES6 类,分配公共变量的方式是简单地引用this,而通过构造函数初始化这些变量的方式正是它在我的类定义中的显示方式。

这是我调用类的方式(在单独的文件中):

这就是问题所在,当我从构造函数中console.log出来时this,我得到了{ id: id }预期的值;this但是,每当我在运行时注销getDocsprocess,它都是空的。this但是,当我在瀑布之前注销时process(),我得到了我的原始对象。

这有什么原因吗?

顺便说一句,我正在使用 node:v0.10.33和 babel-node并且我使用标志4.6.6运行 babel-node 。--harmony在有人问之前,由于主要依赖项卡在v0.10.x.

编辑我能够创建一个解决方法,但它不是很像 es6。问题似乎与async.waterfall. 我不得不使用 a.bind来修复它:

0 投票
1 回答
1513 浏览

javascript - systemJS 的相对动态加载,使用 ES6/Babel 语法

我有一个用纯 ES6 编写的模块,我想在单独的 Web 应用程序中使用它。该模块的入口点是 main.js 并包含以下内容:

main.js

当我使用 systemJS 导入 thismain.js时,它会尝试将这些依赖项解析到 Web 应用程序本地,而不是模块。

获取http://localhost:9000/dist/a.js 404(未找到)

我看到已经支持相对动态加载,但它涉及向函数传递一个额外的System.import函数,我没有使用它——我使用的是 ES6 语法。

有没有关于如何做到这一点的示例或最佳实践?谢谢,麻烦您了。

0 投票
1 回答
787 浏览

node.js - _iteratorError undefined 不是函数

以下代码获取文件的内容,替换一些字符,并输出结果:

测试.txt:

index.js:

我收到此错误:

不知道问题是什么,也不知道是什么throw _iteratorError意思。

我正在使用Babel来解析 ES6 代码。

可能是什么问题呢?

编辑:

这是编译后的函数。但我仍然看不到问题:

0 投票
2 回答
9071 浏览

ecmascript-6 - Babel 生成的代码导致错误导出未定义

当这段代码(从 babel 生成)运行时,我得到一个错误exports is undefined

有任何想法吗?

0 投票
2 回答
7054 浏览

javascript - 如何使用 KARMA 对 React JSX ES6 代码进行单元测试?

我已经用 ES6 编写了我的 React 应用程序。现在我也想用 ES6 编写我的测试。所以这里的挑战是配置业力。

与谷歌一起,我用 karma.config.js 走了这么远(我省略了配置文件中相同的部分!):

我认为这个设置应该做什么:1)将 JSX 编译为 JS,接下来babel应该将 ES6 转换为 ES5。例如,这与polyfill我期望它应该在 phantomjs 中运行一起。但是不,这是我运行它时 karma 的输出:

第 35 行app.jsx包含实际的 JSX 部分。所以,由于某种原因,预处理器似乎没有那么多。预处理器的任何帮助将不胜感激?

更新:我有这个几乎可以工作的酒。原来我拥有的预处理器应该像这样交换

现在,当我运行它时,我得到:

我以为我有一个 polyfill :(

0 投票
1 回答
315 浏览

javascript - 渲染

React v0.12/v0.13:我<select>想在服务器和客户端(同构)上呈现的元素有问题。这是一个当前重新创建问题的示例:

selected属性不在服务器上呈现,但在浏览器中可以正常工作。

我也尝试defaultValue在元素上设置道具<select>,这似乎没有什么区别。但是,当我使用 时,它确实<option value="C" selected>有效,这会在控制台中引发警告,告诉我使用valueordefaultValue道具。

该文档还描述了所需的行为:https ://facebook.github.io/react/docs/forms.html#why-select-value

此代码在 Node v0.12 中运行,使用babel-core进行转译。

这是一个错误,还是我错过了什么?

更新:这是 React 中的一个错误。请参阅下面的评论/链接。

0 投票
2 回答
2073 浏览

javascript - 通过 gulp-watch 使用 babel 转换为 ES 5 不起作用

我是 gulp 的新手。我正在尝试设置手表,以便将我的 src/main.js 文件转换为 dist/main.js 文件。Gulpfile 有以下代码

我的 dist/main.js 文件不反映来自 src/main.js 的更改。任何关于我哪里出错的帮助将不胜感激。

0 投票
1 回答
2365 浏览

node.js - 将 gulp-watch 与 babel.js 一起使用

下面是一个 Gulp ES6 转译任务。它工作正常,但我试图用 gulp-watch 插件替换 gulp.watch 以便捕获新文件。问题是 gulp-watch 没有给我 gulp.watch 在回调中所做的事情,我不知道该怎么做。

这是我最初的工作任务:

到目前为止,我对 gulp-watch 的了解如下:

日志的输出是这样的:

观看事件 - 历史、cwd、base、stat、_contents、event

观看事件 - 更改

观看活动 - ..

我如何让 gulp-watch 给我以前的信息,或者,我如何更改我的任务代码以使其再次与 gulp-watch 一起工作?