我創建了一個新的 Laravel 專案。為了使用 Vue JS，我嘗試安裝這個包，
@vitejs/plugin-vue
但這給我帶來了一系列錯誤，
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/[email protected] npm ERR! Found: [email protected] npm ERR! node_modules/vite npm ERR! dev vite@"^2.9.11" from the root project npm ERR! peer vite@"^2.9.9" from [email protected] 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/[email protected] 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: [email protected] npm ERR! node_modules/vite npm ERR! peer vite@"^3.0.0" from @vitejs/[email protected] 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.
我按照以下步驟操作，
2
5321.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').
我拋出一個錯誤，說安裝@vitejs/plugin-vue。但是當我嘗試安裝它時，它會拋出這些錯誤。
如果其他人遇到此問題，請將其直接新增至您的 package.json 中，然後執行 npm i：
“@vitejs/plugin-vue”：“^3.0.1”
npm install vue@next vue-loader@next npm i @vitejs/[email protected] composer require innocenzi/laravel-vite:0.2.* npm i -D vite vite-plugin-laravelvite.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, }) ] })也許你需要改app.js
import {createApp} from 'vue/dist/vue.esm-bundler.js';或對於非同步元件新增defineAsyncComponent
import {createApp, defineAsyncComponent} from 'vue/dist/vue.esm-bundler.js';@vite() 留空