browserify在watchify下能否动态编译.vue文件

发布于 2022-09-04 18:01:04 字数 1018 浏览 21 评论 0

以下是我的watchify操作,可以动态编译我的所有.js修改,但我在app.js中引入了一个.vue的组件,一旦在watchify下进行了修改,就会报错,假设这被修改的组件是parent.vue,那么报错如下:

Failed to mount component: template or render function not defined.
(found in <Parent>)`
我想就是因为如上所说,在watchify时候不能动态编译.vue文件输出到bundle.js中去,有什么办法来实现这个目的吗?
因为项目原因,不能采取开启一个localhost server的方法。(所以其他有什么解决办法吗?)

gulp.task('test', function(){
  let entries = ['app.js']
  let opts = Object.assign({}, watchify.args, {entries})
  let w_browser = watchify(browserify(opts))
  function bundle () {
    return w_browser.transform(vueify)
            .transform("babelify", {presets: ["es2015"]})
            .transform(browserifyShim)
            .bundle()
            .pipe(source('bundle.js'))
            .pipe(buffer())
            .pipe(gulp.dest('./'));
  }
  bundle()
  w_browser.on('update', bundle)
});

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

甜味拾荒者 2022-09-11 18:01:04

watchify是browserify的进一步封装跟vue没有关系,你用了vue格式的语法须得告诉browserify须得用怎样的方式去解析.vue格式的文件,默认地,他们只认识js这样的语法,所以你得使用watchify时得加上vueify解析它

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文