Visual Studio 2019发布WebApp到WindowsServer2012遇箭头函数解析错误

• 根本原因是项目中用到的gulp-angular-filesort插件不支持ES6+的箭头函数（也就是报错中的=>符号），该插件维护版本较早，默认仅支持解析ES5语法，遇到ES6语法就会抛出解析失败错误，和Gulp本身是否安装没有关联。
• 执行发布操作的电脑Node.js/npm环境的依赖配置，和本地开发环境不一致，本地可能配置了Babel转译ES6语法的前置步骤，而发布机的发布流程缺少该转译环节，导致gulp-angular-filesort直接处理未转译的ES6代码触发报错。

方案1：替换箭头函数为ES5语法 #

直接修改报错的Sensores\creadorGraficos.js文件中的箭头函数，改写为普通function写法，调整后的代码如下：

var presionatmosferica = dataURL.map(function (elemF) {
            return elemF.map(function(o) { return { fecha: o.fecha, presionatmosferica: o.presionatmosferica } })
        });

该方案改动最小，不需要调整构建流程，修改完成后重新执行发布即可。

方案2：调整Gulp构建流程，新增ES6转译环节 #

在gulp-angular-filesort执行逻辑前，增加Babel转译步骤，将所有JS代码转为ES5语法：

1. 首先安装Babel相关依赖：
   npm install @babel/core @babel/preset-env gulp-babel --save-dev
2. 在项目根目录新增.babelrc配置文件，内容如下：

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

3. 修改Gulp配置文件中处理JS的任务，在调用gulp-angular-filesort之前先调用babel()完成转译，示例配置片段：

gulp.task('sort-js', function () {
  return gulp.src('./src/**/*.js')
    .pipe(babel()) // 新增转译步骤
    .pipe(angularFilesort())
    .pipe(gulp.dest('./dist'))
})

方案3：替换兼容ES6的依赖包 #

如果不想调整构建流程也不想修改业务代码，可以将gulp-angular-filesort替换为支持ES6语法的同类功能包，比如gulp-angular-sort-es6，替换完成后修改Gulp配置中对应的插件调用即可。

内容的提问来源于stack exchange，提问作者Luis urrechaga