vue SFC 编译为 .js

https://www.gulpjs.com.cn/docs/getting-started/quick-start/
https://www.npmjs.com/package/gulp-vue-compiler
https://www.npmjs.com/package/babel-env
https://github.com/vuejs/vue-component-compiler/issues/28

cmd

1
2
3
4
5
6
# gulp 命令行工具
yarn global add gulp-cli
yarn add gulp gulp-vue-compiler babel-env

# 执行 task
gulp vue-compile

gulpfile.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
let vueCompiler = require("gulp-vue-compiler");
let gulp = require("gulp");

gulp.task("vue-compile", function () {
  return gulp
    .src("src/components/**/*.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"],
                },
              },
            ],
            "stage-3",
          ],
        },
      })
    )
    .pipe(gulp.dest("./dist/"));
});