简体   繁体   English

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

[英]Grunt + Babel successfully runs but doesn't do anything

I'm rather new to grunt/npm but after reading up the docs. 我对grunt / npm很新,但在阅读了文档之后。 I have made myself a package.json and a Gruntfile.js . 我自己做了一个package.json和一个Gruntfile.js Here's my folder structure: 这是我的文件夹结构:

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

What I have 是)我有的

Here's my Gruntfile : 这是我的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'])
};

And then here's my package.json : 然后这是我的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"
  }
}

What does it do? 它有什么作用?

I have my src/ folder which contains my source files ( *.es6 ). 我有我的src/文件夹,其中包含我的源文件( *.es6 )。 I want to transpile these to a dist/ directory with grunt. 我想用grunt将它们转换为dist/目录。

What I've tried 我试过的

Then I installed all the dependencies / babel-cli / grunt-cli/ etc. with npm install and npm-update --save 然后我用npm installnpm-update --save安装了所有依赖项/ babel-cli / grunt-cli /等。

Seems good, so I went ahead and ran grunt: 看起来很好,所以我继续前进并且咕噜咕噜:

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

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

The ls is outputting the exact same thing as before I ran grunt . ls输出与我运行grunt之前完全相同的东西。 So nothing is appearing to happen. 所以什么都没有出现。 Where's my output dist ? 哪里是我的输出dist This has been bugging me for the past few hours. 在过去的几个小时里,这一直困扰着我。 I've tried installing babelify , and quite a few other fixes from blogs across the internet but alas, nothing works. 我已经尝试过安装babelify ,以及互联网上的博客上的其他一些修复但唉,没有任何作用。

Try using the keyword "presets" instead of "plugins": 尝试使用,而不是“插件”关键字“预设”:

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

When I use your configuration, grunt seems to error out because it can't find the plugin called "es2015". 当我使用你的配置时,grunt似乎出错了,因为它找不到名为“es2015”的插件 Everything worked after I made that change. 在我做出改变后,一切都奏效了。

Try a more literal example from the README like: 从自述文件中尝试一个更为文字的例子:

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

After you get that working try specifying *.es6 etc. under files. 在你工作之后尝试在文件下指定*.es6等。 If you look at the source for the grunt-babel plugin it may be more limited than one would assume. 如果你看一下grunt-babel插件的来源,它可能比人们想象的更有限。

You can also just use npm scripts and specify the babel command line directly which I feel is simpler than using grunt. 您也可以直接使用npm scripts并直接指定babel命令行,我认为这比使用grunt更简单。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM