想要通过Babel使用Vue，但我无法使其正确输出意外的令牌“导出”

Question

所以我以前从未做过，我在网站上点缀了Vue，但在单独的页面上只有plainjs“ Apps”。现在，我想拥有一个根目录“ App”并将其作为组件加载。

我正在将gulp与gulp-vue-compiler一起使用，我猜它可以正常工作，但是它以

的形式导出

Vue.component('sys-admin', {
    ...
}

var render = function () {
};
var staticRenderFns = [];
var __template__ = { render: render, staticRenderFns: staticRenderFns };
export default Object.assign({}, __script__, __template__);

哪个浏览器告诉我 未捕获的SyntaxError：意外的令牌'export'

这是我的任务

function vueCompile() {
    return gulp.src('./Mvc/Views/**/*.vue')
        .pipe(vueCompiler({
            newExtension: 'js', // *.vue => *.js
            babel: {
                babelrc: false,
                presets: [
                  ['env', {
                    modules: false, // Keep ES modules in 'script' tag
                    targets: {
                      browsers: [ '> 1%', 'last 2 versions' ]
                    }
                  }],
                ]
              }
        }))
        .pipe(rename({suffix: '.component'}))
        .pipe(gulp.dest(function (file) {
            return file.base;
        }));
}

我只是缺少一些概念吗？我想使用.vue文件，这样我的模板就不必全部都是一个长字符串，并且可以突出显示所有编辑器的语法。