Question

我在按顺序编译js时遇到问题。我想先编译库或自定义js，但问题是laravel webmix首先编译Vue组件，而不是自定义js。

因此，当我运行命令npm run dev时，它将把所有js合并为public/js/app.js中的一个

但是它将首先添加所有vue组件，然后添加custom.js代码。因此，我想先编译custom.js代码，然后再编译组件代码。

app.js

require('./bootstrap');
require('./custom');

window.Vue = require('vue');

Vue.component('example-component', require('./components/ExampleComponent.vue').default);
Vue.component('product-list', require('./components/ProductListComponent.vue').default);
Vue.component('cart', require('./components/CartComponent.vue').default);

webpack.mix.js

const mix = require('laravel-mix');

mix.js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css');

Answer 1

app.js

require('./bootstrap');

window.Vue = require('vue');

Vue.component('example-component', require('./components/ExampleComponent.vue').default);
Vue.component('product-list', require('./components/ProductListComponent.vue').default);
Vue.component('cart', require('./components/CartComponent.vue').default);

custom.js

require('./custom');

window.Vue = require('vue');

Vue.component('example-component', require('./components/ExampleComponent.vue').default);
Vue.component('product-list', require('./components/ProductListComponent.vue').default);
Vue.component('cart', require('./components/CartComponent.vue').default);

webpack.mix.js

const mix = require('laravel-mix');

mix.js('resources/js/app.js', 'public/js')
   .js('resources/js/custom.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css');

Laravel Webmix JS编译问题与Vue Component一起排序

1 个答案: