巴曼在巴贝尔喝醉了(es2015)

时间:2016-09-13 07:30:13

标签: gulp ecmascript-6 yeoman babeljs yeoman-generator

我创建了一个yeoman生成器,当我开始使用babel时将gulpefile.js更改为gulpfile.babel.js(并添加.babelrc文件)外部gulpfile.js(而不是项目gulpfile.babel.js)启动失败。

使用gulpfile.babel.js生成的项目有效。我设法将失败的gulp任务指向gulp pre-test

这是我的生成器树:

.
├── README.md
├── generators
│   └── app
│       ├── index.js
│       └── templates
│           └── my-awesome-site
│               ├── Gemfile
│               ├── README.md
│               ├── _config.yml
│               ├── _includes
│               │   ├── footer.html
│               │   ├── head.html
│               │   └── header.html
│               ├── _layouts
│               │   ├── default.html
│               │   ├── page.html
│               │   └── post.html
│               ├── _posts
│               │   └── 2016-09-08-welcome-to-jekyll.markdown
│               ├── about.md
│               ├── feed.xml
│               ├── gulpfile.babel.js
│               ├── images
│               │   └── touch
│               │       ├── apple-touch-icon.png
│               │       ├── chrome-touch-icon-192x192.png
│               │       ├── icon-128x128.png
│               │       └── ms-touch-icon-144x144-precomposed.png
│               ├── index.html
│               ├── package.json
│               ├── robots.txt
│               ├── scss
│               │   ├── _base.scss
│               │   ├── _layout.scss
│               │   ├── _syntax-highlighting.scss
│               │   └── main.scss
│               └── travis
├── gulpfile.js
├── package.json
└── test
    └── app.js

我设法确定了失败的gulp任务gulp pre-test

gulp.task('pre-test', function () {
  return gulp.src('generators/**/*.js')
    .pipe(excludeGitignore())
    .pipe(istanbul({
      includeUntested: true
    }))
    .pipe(istanbul.hookRequire());
});

错误消息:

[10:26:27] Using gulpfile ~/WebstormProjects/generator-jekyll-starter-kit/gulpfile.js
[10:26:27] Starting 'pre-test'...
Failed to parse file: /Users/nirgalon/WebstormProjects/generator-jekyll-starter-kit/generators/app/templates/my-awesome-site/gulpfile.babel.js

events.js:160
      throw er; // Unhandled 'error' event
      ^
Error: Unable to parse /Users/nirgalon/WebstormProjects/generator-jekyll-starter-kit/generators/app/templates/my-awesome-site/gulpfile.babel.js

Line 3: Unexpected token

第3行的gulpfile.babel.js

'use strict';

import gulp from 'gulp';
import gulpLoadPlugins from 'gulp-load-plugins';
import runSequence from 'run-sequence';
import browserSync from 'browser-sync';

const $ = gulpLoadPlugins();

// Minify the HTML.
gulp.task('minify-html', () => {
  return gulp.src('_site/**/*.html')
    .pipe($.htmlmin({
      removeComments: true,
      collapseWhitespace: true,
      collapseBooleanAttributes: true,
      removeAttributeQuotes: true,
      removeRedundantAttributes: true,
      removeEmptyAttributes: true,
      removeScriptTypeAttributes: true,
      removeStyleLinkTypeAttributes: true,
      removeOptionalTags: true
    }))
    .pipe(gulp.dest('_site'))
});

我试着搞清楚,没有成功(我认为这与babel有关,并试图在项目根package.json中安装babel。)

2 个答案:

答案 0 :(得分:0)

你在你的gulpfile中使用es2015。您的Node版本是否支持它?

答案 1 :(得分:0)

我设法找到答案。它是gulp-eslint,他不承认ES2015语法。当我将下面的代码添加到eslint gulp任务时,测试运行正常。

{
  ecmaFeatures: {
    modules: true
  },
  envs: [
    'browser', 'es6'
  ],
  parserOptions: {
    sourceType: 'module'
  }
}

整个任务:

gulp.task('static', function () {
  return gulp.src('**/*.js')
    .pipe(excludeGitignore())
    .pipe(eslint({
      ecmaFeatures: {
        modules: true
      },
      envs: [
        'browser', 'es6'
      ],
      parserOptions: {
        sourceType: 'module'
      }
    }))
    .pipe(eslint.format())
    .pipe(eslint.failAfterError());
});