1 
'use strict'

angular.module('dog.Component',[])
.component('dogComponent',{
  // templateUrl:'home.html',  // this line will be fine
  template:`<h1>Anything Here will screw up the code</h1>`
})

所以我使用 gulp 将所有 Angular js 代码编译为一个。似乎在angular 1.5.8或close中，当使用``引号时，uglify无法缩小代码..

'use strict';

var gulp = require('gulp');
var concat = require('gulp-concat');
var uglify = require('gulp-uglify')


var indexTarget=[
  './page.index/*.js'
]
gulp.task('index',function(){
  return gulp.src(indexTarget)
          .pipe(concat('index.js'))
          .pipe(uglify())
          .pipe(gulp.dest('page.index/'))
  })


gulp.task("watch", function(){
  gulp.watch(jstarget, ["js"])
})

有经验的可以快速浏览一下吗？

4

1 回答 1

1

反引号是 ES2015 的一个特性，但gulp-uglify只识别 ES5 语法。最简单的解决方案是首先通过 babel 管道您的源代码，它可以将 ES2015 转换为 ES5 语法，然后对其进行 uglify。

var gulp = require('gulp');
var concat = require('gulp-concat');
var uglify = require('gulp-uglify')
var babel = require('gulp-babel');

var indexTarget=[
  './page.index/*.js'
]
gulp.task('index',function(){
  return gulp.src(indexTarget)
          .pipe(concat('index.js'))
          .pipe(babel({ presets: ['es2015'] }))
          .pipe(uglify())
          .pipe(gulp.dest('page.index/'))
  })

应该可以工作，并且可以让你安全地使用 ES2015 语法。您需要将gulp-babel和添加babel-preset-es2015到您的项目中。也许babel-cli虽然我认为安装gulp-babel应该将其作为依赖项

你还需要告诉 babel 使用 es2015 插件。您可以通过创建.babelrc文件或将配置添加到您的package.json. 最低配置将是创建.babelrc包含：

{
  "presets": ["es2015"]
}

检查https://babeljs.io/docs/learn-es2015/以查找它可以让您直接使用的 ES2015 语法的哪些部分。对于某些功能（例如生成器），您可能还需要添加一个 polyfill，但您可以通过在构建管道中包含 babel 来使用很多功能。

于 2016-09-23T09:25:46.547 回答