Question

我正在开发一个dojo项目（1.11.x），最近开始使用ES6（ES2015）语法，例如const，let和模板文字。它工作正常，直到我使用dojo-util构建项目。我有如下错误

ERROR - Parse error. TypeError: redeclaration of const {variable name}
ERROR - Parse error. illegal character
                     return `<a href="/xxx/xxx/${a}">${b}</a>`;
                            ^

有没有办法让构建系统识别ES6语法或绕过语法检查？

Answer 1

2016年12月的最新版本Dojo 1.12更新为使用Closure Compiler 20160911，支持将ES6转换为ES5。

我在一个项目中有一个较旧的ES5模块和ES6中的新模块。

在ES6模块中，您必须在开头添加＆＃34;使用strict＆＃34; ，否则构建失败。

error(307) Failed to evaluate module tagged as pure AMD 
(fell back to processing with regular expressions). module: app/es6/Test;
error: SyntaxError: Block-scoped declarations (let, const, function, class)  
not yet supported outside strict mode

应用程序/ ES6 / Dialog.js

"use strict"    
define(["dijit/ConfirmDialog"], (ConfirmDialog) => {
let id = '1'
const dialog = new ConfirmDialog({
    title: "Delete",
    content: `Are you sure you want to delete ${id} ?`,
    style: "width: 300px"
    })
    dialog.show()
})

然后在你的app.profile.js中添加 optimizeOptions 对象

...
optimizeOptions: {
    languageIn: 'ECMASCRIPT6',
    languageOut: 'ECMASCRIPT5'
},
layerOptimize: "closure.keeplines",
optimize: "closure.keeplines",
cssOptimize: "comments",
mini: true,
stripConsole: "all",
selectorEngine: "lite",
useSourceMaps: false,
...
layers: {
    "dojo/dojo": {
        includeLocales: [ 'en-us' ],
        include: [ "dojo/dojo", "dojo/hash" ],
        boot: true,
        customBase: true    
    }
    "app/Main": {
        includeLocales: [ 'en-us' ],
        include: [
            'app/Header',
            'app/Main'
        ]
    },
...

应用程序/ Main.js

define(["app/es6/Dialog"], function(Dialog) {
    Dialog.show();
});

这样您就可以将ES6集成到当前的Dojo项目中。

我也试图避免＆＃34;使用严格的＆＃34;在ES6模块中，将 languageOut：ECMASCRIPT5_STRICT 设置为mention here，但它会破坏Dojo本身。

Answer 2

由于Dojo 1.x上的开发似乎停滞了，并且无法轻松迁移到Dojo 2.x，因此我们不得不为此提出一个解决方案。我们作为开发人员坚持使用ES5功能，只是因为构建过程无法处理它，这真是荒谬。

这就是为什么我想出一种解决方法的原因，该解决方法目前已在我们公司中进行测试。对于感兴趣的人，这是我们解决此问题的方法（并且仍然使用dojo构建过程的核心部分）：

在构建配置文件中禁用优化（layerOptimize：false，optimize：false）
在package.js中将所有小部件标记为非AMD（amd：function（）{return false;}）
这会导致所有小部件在构建中得到警告，但不会失败
在构建过程完成之后，所有“图层”文件均已完成（可能包括ES6功能），但尚未缩小，因此非常大。
在Maven（或您选择的构建工具）中，运行任何适合您的缩小器。
我们使用具有以下设置的最新Closure编译器，它将ES2017代码转换为ES5。

<plugin>
  <groupId>org.apache.maven.plugins</groupId>
  <artifactId>maven-antrun-plugin</artifactId>
  <executions>
    <execution>
      <exec executable="java" resolveexecutable="true" failonerror="true">
        <arg value="-jar" />
        <arg value="${google.closure.compiler.es2017}" />
        <arg value="--language_in=ECMASCRIPT_2017" />
        <arg value="--language_out=STABLE" />
        <arg value="--js" />
        <arg value="${dojo.build.path}/build/layers/OriginalLayer.js" />
        <arg value="--js_output_file" />
        <arg value="${dojo.build.path}/build/layers/MinifiedLayer.js" />
      </exec>
    </execution>
  </executions>
</plugin>

这仍然是实验性的，但最初的结果看起来不错，而且似乎在不进行回归的情况下也能正常工作。

dojo构建系统无法识别es6语法

2 个答案: