从Babel升级到版本7,而Browserify出现问题

时间:2019-01-17 11:08:03

标签: gulp browserify babel

我正尝试将babel的版本从6更新到7,我卸载了babel 6,对package.json文件进行了以下更改,将其更新为版本7,并更新了browserify和babelify以便能够处理babel更新。

-    "babel-core": "^6.26.3",
-    "babel-plugin-transform-es2015-for-of": "^6.23.0",
-    "babel-plugin-transform-runtime": "^6.23.0",
-    "babel-preset-env": "^1.6.1",
-    "babel-preset-es2015": "^6.24.1",
-    "babel-preset-stage-0": "^6.24.1",
-    "babelify": "^8.0.0",
-    "browserify": "^16.2.0",
+    "@babel/core": "^7.2.2",
+    "@babel/plugin-transform-for-of": "^7.2.0",
+    "@babel/plugin-transform-runtime": "^7.2.0",
+    "@babel/preset-env": "^7.2.3",
+    "babelify": "^10.0.0",
+    "browserify": "^16.2.3",

我有一个简单的gulp实现,如下所示:

gulp.task('js:compile', ['js:lint'], function () {
    return browserify({
        entries: paths.js + '/main.js',
        debug: true
    })
    .transform(babelify, { global: true })
    .bundle()
    .on('error', function (err) { console.error(err); })
    .pipe(source('main.js'))
    .pipe(buffer())
    .pipe(sourcemaps.init({ loadMaps: true }))
    .pipe(sourcemaps.write('./'))
    .pipe(gulp.dest(paths.buildJs));
});

还有我的.babelrc

{
  "presets": [
    [
        "@babel/preset-env", {
            "modules": false,
            "targets": {
                "browsers": [
                    "last 5 versions",
                    "ie 11",
                    "safari >= 7"
                ]
            }
        }
    ]
  ],
  "plugins": [
    "@babel/plugin-transform-for-of",
    "@babel/plugin-transform-runtime"
  ]
}

尝试运行该错误时,出现以下错误,main.js是我的javascript的主要入口点。

SyntaxError: 'import' and 'export' may appear only with 'sourceType: module' (1:0) while parsing /Users/codecomp/test/assets/js/main.js while parsing file: /Users/codecomp/test/assets/js/main.js

此实现以前在我的较旧版本的Babel,Browserify和Babelify上运行良好/我一直在浏览更改日志,但找不到任何可能导致此问题的相关信息。以前,在我第一次设置项目时,我也遇到了同样的错误,尽管我不记得自己修复或造成的错误。

0 个答案:

没有答案