Grunt + Babel成功运行但没有做任何事情

时间:2016-04-10 03:46:11

标签: javascript node.js npm gruntjs grunt-babel

我对grunt / npm很新,但在阅读了文档之后。我自己做了package.jsonGruntfile.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)。我想用grunt将它们转发到dist/目录。

我尝试了什么

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

看起来很好,所以我继续前进并且咕噜咕噜:

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

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

ls的输出与我运行grunt之前的输出完全相同。所以什么都没有出现。我的输出dist在哪里?在过去的几个小时里,这一直困扰着我。我尝试过安装babelify以及其他一些来自互联网博客的修补程序,但唉,没有任何作用。

2 个答案:

答案 0 :(得分:3)

尝试使用关键字" presets"而不是"插件":

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

当我使用您的配置时,grunt似乎出错,因为它无法找到名为" es2015"的 插件 。在我做出改变后,一切都运转了。

答案 1 :(得分:0)

尝试使用自述文件中的更多文字示例,如:

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

完成工作后,尝试在文件下指定*.es6等。如果你看一下grunt-babel插件的来源,它可能比人们想象的更有限。

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