Laravel Vueify、Browserify和（禁用）热重新加载

我以前用过

elixir

和

browserify

。但是，我想开始使用

Vueify

，这样我就可以将所有组件的部分（

HTML

/

CSS

/

JS

）放在一个文件中

似乎拉威尔·布劳塞里菲的情况有所改变

通常（我发现）答案如下：

var elixir = require('laravel-elixir');

var vueify = require('laravel-elixir-browserify').init("vueify");

elixir(function(mix) {
    // resources/assets/js/main.js
    mix.vueify('main.js', {insertGlobals: true, transform: "vueify", output: "public/js"});
});

这将抛出错误：

Error: Cannot find module 'laravel-elixir/ingredients/commands/Utilities'
//...//
at Object.<anonymous> (C:\Users\BLANKED\Code\Project\node_modules\laravel-elixir-browserify\index.js:5:17)

JeffreyWay

的方法现在将

gulp

，但是它似乎不包括任何

*.vue

文件，而是用

vue热重新加载api

函数替换它们以大概检索它

这看起来很棒，而且毫无疑问，我会发现它非常有用。
但它不起作用，我不知道如何禁用它。
而且一个非常基本的

Vue

应用程序不起作用。 或者我做错了什么

编辑：
为了说明这一点，我很乐意

吞下
*.vue
文件，而不必进行热重新加载。

也许这是在使用homestead时才起作用的，但我希望在不运行
homestead
的情况下进行一些快速而肮脏的测试

最终编辑：

//gulpfile.js
var elixir = require('laravel-elixir');
elixir.config.js.browserify.transformers.push({
 name: 'vueify'
});

elixir(function(mix) {
 mix.browserify('main.js');
});


// main.js
var Vue = require('vue')
var App = require('./app.vue')

new Vue({
    el: 'body',
    components: {
        app: App
    }
})

// app.vue
<style>
  .red {
    color: #f00;
  }
</style>

<template>
  <h1 class="red">{{msg}}</h1>
</template>

<script>
  module.exports = {
    data: function () {
      return {
        msg: 'Hello world!'
      }
    }
  }
</script>

//gulpfile.js
var elixir=需要（'laravel-elixir'）；
elixir.config.js.browserify.transformers.push({
名称：“vueify”
});
长生不老药（功能（混合）{
mix.browserify（'main.js'）；
});
//main.js
var Vue=require（'Vue'）
var App=require（“./App.vue”）
新Vue({
el:‘身体’，
组成部分：{
app:app
}
})
//app.vue
瑞德先生{
颜色：#f00；
}
{{msg}}
module.exports={
数据：函数（）{
返回{
味精：“你好，世界！”
}
}
}
自Vueify起，现在已包含在Laravel Elixr中。我发现当手动包含Vueify transformer时，它会运行两次，导致无法正确创建模板，只留下热重新加载代码

为了解决这个问题，我刚刚从我的
gulpfile.js
中删除了以下几行

elixir.config.js.browserify.transformers.push({
    name: 'vueify'
});

您可能还必须确保您的laravel elixr版本高于
3.4.0
版本，我将在本周晚些时候对此进行测试。通过挖掘
node\u modules
文件夹，我看到
vueify
就在那里。我没想到不告诉
elixir
使用它。所以这是有道理的。正如我所说，我将在本周晚些时候进行测试，mark解决了：）
elixir.config.js.browserify.transformers.push({
    name: 'vueify'
});