4

我对 grunt/npm 很陌生,但是在阅读了文档之后。我已经让自己 apackage.json和 a Gruntfile.js。这是我的文件夹结构:

/
|- src
    |- myfile.es6
    |- anotherfile.es6
    |- etc.
|- Gruntfile.js
|- package.json

我有的

这是我的Gruntfile

module.exports = function(grunt) {
    require('load-grunt-tasks')(grunt);

    grunt.initConfig({
        babel: {
            options: {
                sourceMap: true,
                plugins: ['es2015']
            },
            dist: {
                files: [{
                    expand: true,
                    cwd: 'src/',
                    src: ['*.es6'],
                    dest: 'dist/',
                    ext: '.js'
                }]
            }
        }
    });

    grunt.registerTask('default', ['babel'])
};

然后这是我的package.json

{
  "name": "Cheddar",
  "version": "0.2.0",
  "devDependencies": {
    "babel-preset-es2015": "^6.6.0",
    "grunt": "^1.0.1",
    "grunt-babel": "^6.0.0"
  },
  "scripts": {
    "test": "grunt --verbose"
  }
}

它有什么作用?

我有我的src/文件夹,其中包含我的源文件(*.es6)。我想将这些转换为dist/带有 grunt 的目录。

我试过的

然后我安装了所有的依赖项/babel-cli/grunt-cli/等npm installnpm-update --save

看起来不错,所以我继续咕哝着跑:

$ grunt
Running "babel:dist" (babel) task

Done.
$ ls
Gruntfile.js  node_modules/  package.json  src/

ls正在输出与我运行之前完全相同的内容grunt。所以似乎什么都没有发生。我的输出在哪里dist?在过去的几个小时里,这一直困扰着我。我已经尝试安装babelify,以及来自互联网博客的许多其他修复程序,但唉,没有任何效果。

4

2 回答 2

3

尝试使用关键字“presets”而不是“plugins”:

babel: {
  options: {
      sourceMap: true,
      presets: ['es2015']
  }
  ...
}

当我使用你的配置时,grunt 似乎出错了,因为它找不到名为“es2015”的插件。在我做出那个改变之后,一切都奏效了。

于 2016-04-10T08:10:30.727 回答
0

尝试 README 中更文字的示例,例如:

grunt.initConfig({
    babel: {
        options: {
            sourceMap: true,
            presets: ['es2015']
        },
        dist: {
            files: {
                'dist/myfile.js': 'src/myfile.es6'
            }
        }
    } });

完成该工作后,尝试*.es6在文件下指定等。如果您查看 grunt-babel 插件的源代码,它可能比人们想象的要有限。

您也可以直接使用npm scripts和指定 babel 命令行,我觉得这比使用 grunt 更简单。

于 2016-04-10T04:05:32.683 回答