Saya mencipta projek Laravel baharu. Untuk menggunakan Vue JS, saya cuba memasang pakej ini,
@vitejs/plugin-vue
Tetapi ini memberi saya beberapa siri kesilapan,
npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead. npm ERR! code ERESOLVE npm ERR! ERESOLVE could not resolve npm ERR! npm ERR! While resolving: @vitejs/plugin-vue@3.0.0 npm ERR! Found: vite@2.9.14 npm ERR! node_modules/vite npm ERR! dev vite@"^2.9.11" from the root project npm ERR! peer vite@"^2.9.9" from laravel-vite-plugin@0.4.0 npm ERR! node_modules/laravel-vite-plugin npm ERR! dev laravel-vite-plugin@"^0.4.0" from the root project npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer vite@"^3.0.0" from @vitejs/plugin-vue@3.0.0 npm ERR! node_modules/@vitejs/plugin-vue npm ERR! @vitejs/plugin-vue@"^3.0.0" from the root project npm ERR! npm ERR! Conflicting peer dependency: vite@3.0.0 npm ERR! node_modules/vite npm ERR! peer vite@"^3.0.0" from @vitejs/plugin-vue@3.0.0 npm ERR! node_modules/@vitejs/plugin-vue npm ERR! @vitejs/plugin-vue@"^3.0.0" from the root project npm ERR! npm ERR! Fix the upstream dependency conflict, or retry npm ERR! this command with --force, or --legacy-peer-deps npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
Saya ikut langkah di bawah,
1.laravel new {proj_name}. 2. npm install vue@next. 3. npm install. 4. After that I created a vue file and imported into app.js (resources/js/app.js). 5. I went to the blade file and cleared all -> hit `!` for emmet snippet, created a div with id #app, and add @vite('resources/js/app.js').
Saya membuat ralat mengatakan memasang @vitejs/plugin-vue. Tetapi apabila saya cuba memasangnya, ia menimbulkan ralat ini.
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Jika orang lain menghadapi masalah ini, sila tambahkannya terus pada package.json anda dan jalankan npm i:
"@vitejs/plugin-vue":"^3.0.1"
vite.config.js
import { defineConfig } from 'vite' import vue from '@vitejs/plugin-vue' import laravel from 'vite-plugin-laravel' export default defineConfig({ plugins: [ vue(), laravel({ input: [ 'resources/css/app.css', 'resources/js/app.js', ], refresh: true, }) ] })Mungkin anda perlu menukar app.js
import {createApp} from 'vue/dist/vue.esm-bundler.js';Atau tambahkan defineAsyncComponent
untuk komponen tak segerakimport {createApp, defineAsyncComponent} from 'vue/dist/vue.esm-bundler.js';@vite() Biarkan kosong