Vue路由器：Gulp uglify /監視節點錯誤

Question

剛開始使用Vue路由器並開始使用，但馬上遇到了問題。

使用與示例相同的代碼：

const Home = { template: '<div>Home</div>' }

const routes = [
    { path: '/', component: Home }
]

const router = new VueRouter({
    routes // short for routes: routes
})

const app = new Vue({
    router
}).$mount('#app')

我運行了Gulp watch，當保存文件時，該錯誤在我的終端中引發此錯誤：

events.js:160
  throw er; // Unhandled 'error' event
  ^
Error
at new JS_Parse_Error (eval at <anonymous> (/Users/dev/Desktop/clients/ms-photography/node_modules/uglify-js/tools/node.js:28:1), <anonymous>:1545:18)
at js_error (eval at <anonymous> (/Users/dev/Desktop/clients/ms-photography/node_modules/uglify-js/tools/node.js:28:1), <anonymous>:1553:11)
at croak (eval at <anonymous> (/Users/dev/Desktop/clients/ms-photography/node_modules/uglify-js/tools/node.js:28:1), <anonymous>:2092:9)
at token_error (eval at <anonymous> (/Users/dev/Desktop/clients/ms-photography/node_modules/uglify-js/tools/node.js:28:1), <anonymous>:2100:9)
at expect_token (eval at <anonymous> (/Users/dev/Desktop/clients/ms-photography/node_modules/uglify-js/tools/node.js:28:1), <anonymous>:2113:9)
at expect (eval at <anonymous> (/Users/dev/Desktop/clients/ms-photography/node_modules/uglify-js/tools/node.js:28:1), <anonymous>:2116:36)
at eval (eval at <anonymous> (/Users/dev/Desktop/clients/ms-photography/node_modules/uglify-js/tools/node.js:28:1), <anonymous>:2689:13)
at eval (eval at <anonymous> (/Users/dev/Desktop/clients/ms-photography/node_modules/uglify-js/tools/node.js:28:1), <anonymous>:2139:24)
at expr_atom (eval at <anonymous> (/Users/dev/Desktop/clients/ms-photography/node_modules/uglify-js/tools/node.js:28:1), <anonymous>:2619:35)
at maybe_unary (eval at <anonymous> (/Users/dev/Desktop/clients/ms-photography/node_modules/uglify-js/tools/node.js:28:1), <anonymous>:2795:19)

這是我在gulpfile中的監視代碼：

gulp.task('scripts', function() {
   return gulp.src('wp-content/themes/ms-photography/src/js/*.js')
    .pipe(minify())
    .pipe(gulp.dest('wp-content/themes/ms-photography/dist/js/'))
    .pipe(livereload());
});

如果我不編譯腳本，它將很好用...有什么想法嗎？

Answer 1

我想您需要在管道中添加gulp-babel，即

npm install --save-dev gulp-babel babel-preset-es2015

然后：

gulp.task('scripts', function() {
  return gulp.src('wp-content/themes/ms-photography/src/js/*.js')
    .pipe(babel({
        presets: ['es2015']
    }))
    .pipe(minify())
    .pipe(gulp.dest('wp-content/themes/ms-photography/dist/js/'))
    .pipe(livereload());
});