grunt 运行babel 总是报错,scss转css可以成功,求各位哥哥指教

gruntfile.js

module.exports = function (grunt) {

// Project configuration.
grunt.initConfig({
    //Read the package.json (optional)
    pkg: grunt.file.readJSON('package.json'),
    // Metadata.
    meta: {
        srcJsPath: './static/js/',
        srcSassPath: './static/css/',
        srcImgPath: './static/images/',
        distPath: './static/dist/'
    },
    //babel
    babel: {
        options: {
            sourceMap: true,
            presets: ['env']
        },
        dist: {
            files: [{
                expand:true,
                cwd:'static/js/', //js目录下
                src: '*.js', //所有js文件
                dest:'static/dist/'  //输出到此目录下
            }]
        }
    },
    // sass
    sass: {
        dist: {
            options: {
                style: 'compressed',
                sourcemap: 'none'
            },
            files: [
                {'<%= meta.distPath %>nav_list.css': '<%= meta.srcSassPath %>nav_list.scss'},
            ]
        }
    },
    watch: {
        build: {
            files: [
                '<%= meta.srcJsPath %>*.js', '<%= meta.srcSassPath %>*.scss',
            ],
            tasks: ['sass']
        }
    }
});
grunt.loadNpmTasks('grunt-babel');
grunt.loadNpmTasks('grunt-contrib-sass');
grunt.loadNpmTasks('grunt-contrib-watch');

// 默认被执行的任务列表。
grunt.registerTask('default', ['sass', 'babel', 'watch']);

};

项目目录是这样的

clipboard.png

运行grunt 总报错

clipboard.png

scss可以转换成功,es6转es5不能成功
clipboard.png

阅读 2.4k
1 个回答

没有用 grunt 结合 babel 编译过代码,不过从错误信息看来,应该是没有找到 env 这个 babel preset。你的 babel 配置项中指定了

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

试试先安装一下 babel-preset-env

npm install babel-preset-env --save-dev

我推测的,希望有帮助

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题