Question

我在github和stackoverflow上经历了很多帖子。我的package.json中有以下dev依赖项，用于es6到es5的转换。

        "babel-cli": "^6.26.0",
        "babel-core": "^6.26.0",
        "babel-loader": "^6.0.0",
        "babel-preset-env": "^1.6.1",
        "babel-preset-es2015": "^6.24.1",
        "babel-preset-latest": "^6.24.1",
        "babelify": "^8.0.0",
        "browserify": "^15.0.0",
        "grunt-browserify": "^5.2.0",
        "grunt": "^1.0.1",
        "grunt-cli": "^1.2.0"

我已经设置了一个繁琐的任务，使用babelify作为变换器和browserify将我的es6文件编译为es5。



       browserify: {
            dist: {
                src: [‘src/component/myes6.js’],
                dest: ‘dist/src/component/myes5.js’,
                options: {
                    transform: [
                        ['babelify', {presets: [["es2015", { loose: true, modules: false }]]}]
                    ],
                    browserifyOptions: {
                        debug: true
                    }
                }
            }
        }

我的es6 js文件正在导入一个节点模块，该模块是es6 js文件并导出为函数。我试图从各种论坛中听取许多建议，并查看了babel / babelify / grunt-browserify文档，但无法得出具体结论。

之前我想过，它可能是版本问题，但我现在使用所有babel 6版本和最新的browserify / grunt-browserify等。但是，我仍然看到以下错误：

ParseError: 'import' and 'export' may appear only with 'sourceType: module'

任何帮助或指示将不胜感激。

Answer 1

我还没试过运行它，但是你的browserify dist / src周围的方括号不应该在那里。尝试在没有它们的情况下运行此文件。

Answer 2

我通过安装 esmify 插件 npm install babel-plugin-esmify browser-resolve --save-dev 解决了这个问题。

browserify: {
           dist: {
               src: ['src/component/myes6.js'],
               dest: 'dist/src/component/myes5.js',
               options: {
               plugin: [
                   [require('esmify')]
               ],
               transform: [
                    ['babelify', {
                        presets: [["es2015", { loose: true, modules: false }]]
                       }
                   ]
               }
           }
       },

Grunt构建失败 - ParseError：'import'和'export'可能只出现'sourceType：module'

2 个答案: