[英]'import' and 'export' may appear only with 'sourceType: module'
I've got the following gulpfile.js: 我有以下gulpfile.js:
var gulp = require('gulp'), babelify = require('babelify'), browserify = require('browserify'), envify = require('envify/custom'), eslint = require('gulp-eslint'), stylelint = require('gulp-stylelint'), vueify = require('vueify'); var vueCompile = function (app) { var b = browserify({ entries: 'Views/Ui/src/' + app + '/main.js', debug: true, paths: ['./node_modules', './node_modules/globalize/dist'], transform: [babelify, vueify] }); return b.transform( { global: true }, // Required in order to process node_modules files envify({ NODE_ENV: process.env.NODE_ENV }) ) .bundle() // .pipe(source('ui.js')) // .pipe(buffer()) // .pipe(process.env.NODE_ENV === 'production' ? uglify() : buffer()) // .pipe(gulp.dest('Views/Ui/js/' + app)) }; gulp.task('vue', function () { return vueCompile('ui'); });
and the following package.json dependencies: 以及以下package.json依赖项:
"devDependencies": { "babel-core": "^6.26.3", "babel-plugin-transform-runtime": "^6.23.0", "babel-polyfill": "^6.13.0", "babel-preset-env": "^1.7.0", "babel-preset-es2015": "^6.24.1", "babel-preset-stage-2": "^6.13.0", "babel-runtime": "^6.26.0", "babelify": "7.3.0", "browserify": "^16.2.2", "dateformat": "^1.0.12", "envify": "^4.1.0", "gulp": "^3.9.1", "gulp-babel": "^6.1.2", "gulp-clean": "^0.3.2", "gulp-clean-css": "^2.0.11", "gulp-debug": "3.2.0", "gulp-plumber": "^1.1.0", "gulp-rename": "^1.2.2", "gulp-replace": "^0.5.4", "gulp-uglify": "^3.0.0", "gulp-watch": "^4.3.9", "gulp-zip": "^3.2.0", "merge-stream": "^1.0.1", "node-sass": "^3.13.1", "run-sequence": "^2.1.0", "sassify": "^2.0.0", "vinyl-buffer": "^1.0.1", "vinyl-source-stream": "^1.1.0", "vue": "^2.5.16", "vue-resource": "1.5.1", "vueify": "^9.4.0", "vuex": "^2.0.0" }, "dependencies": { "acorn": "^6.0.4", "cldr-core": "^33.0.0", "cldr-dates-full": "^33.0.0", "cldr-numbers-full": "^33.0.0", "devextreme": "18.2.3", "devextreme-vue": "18.2.3", "eslint": "^3.18.0", "eslint-plugin-vue": "beta", "globalize": "^1.3.0", "gulp-eslint": "^4.0.0", "gulp-phpcs": "^2.2.0", "gulp-stylelint": "^4.0.0", "quill": "^1.3.6", "stylelint": "^8.0.0", "stylelint-config-recommended": "^1.0.0", "stylelint-config-standard": "^17.0.0", "stylelint-processor-html": "^1.0.0", "v-hotkey": "^0.2.3", "vinyl-source-stream": "^1.1.0" }
Since I'm trying to minimize my example it may be that there are a few dependencies which are not necessary for the example. 由于我试图最小化我的示例,因此可能有一些示例不需要的依赖项。
My main.js starts with the following line of code: 我的main.js从以下代码行开始:
import App from './components/App.vue'
If I'm going to run the gulp task vue
it ends in the following output: 如果我要运行gulp任务
vue
它将以以下输出结束:
[10:57:57] Using gulpfile ...\gulpfile.js
[10:57:57] Starting 'vue'...
[10:57:57] 'vue' errored after 68 ms
[10:57:57] Error:
...\Ui\src\akte\main.js:1
import App from './components/App.vue';
^
ParseError: 'import' and 'export' may appear only with 'sourceType: module'
As I can say, babelify doesn't seem to run successfully, because the exception will be thrown when the .bundle()
method will be called. 正如我可以说的那样,babelify似乎无法成功运行,因为在调用
.bundle()
方法时将引发异常。
Am I missing something basic? 我缺少基本的东西吗?
I've found the answer by myself. 我自己找到了答案。 So just in case someone has the same problem, here is my solution:
因此,以防万一有人遇到相同的问题,这是我的解决方案:
The .babelrc
file was missing, so something went wrong while transforming the code. .babelrc
文件丢失,因此在转换代码时出了点问题。 My file has the following content: 我的文件包含以下内容:
{
"presets": [
"env",
"stage-2"
],
"plugins": [
"transform-runtime"
]
}
After adding the file in the same directory as the gulpfile.js
everything works as expected. 在将文件添加到与
gulpfile.js
相同的目录中后,一切正常。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.