Partager un enregistrement de piège Vue d'une compilation Laravel Mix

La colonne tutorielle suivante de Laravel partagera avec vous un enregistrement de piège Vue de compilation Laravel Mix. J'espère qu'il sera utile aux amis qui en ont besoin !

Laravel Mix Compile Vue Pitfall Record

Environnement :

// package
"laravel-mix": "^6.0.6",
// composer
"laravel/framework": "^8.54"
node version v15.14.0
npm version 7.7.6

Npm doit d'abord installer les dépendances vue, vue-loader, vue-template-compiler

Ensuite, ouvrez le fichier webpack.mix.js

// 将
mix.js('resources/js/app.js', 'public/js')
// 修改为
mix.js('resources/js/app.js', 'public/js').vue()

Ouvrez /resources/js/app.js

import Vue from 'vue'  // 必须引入 vue 
require('./bootstrap');
Vue.component('welcome-component', require('./components/WelcomeComponent.vue').default); // 组件后需要添加 .default 否则会报错
const app = new Vue({
    el: '#app'
});

et exécutez-le pour des instructions sur .default, voir ici https://github.com/vuejs/vue-loader/releases/tag/v13.0.0

npm run dev

C'est. it , il y a quelques changements après l'utilisation de Laravel-Mix 6, qui sont enregistrés ici.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!