vue前端編譯報錯的圖文解決方法
控制臺報錯:(其他報錯信息往下滑,下面的解決方法可以解決大部分的報錯,不只是這一種)
ERROR Error loading vue.config.js:
ERROR TypeError: defineConfig is not a function
TypeError: defineConfig is not a function
at Object.<anonymous> (D:\java\Develop\learn\vue-vue\vue\vue.config.js:3:18)
at Module._compile (node:internal/modules/cjs/loader:1376:14)
at Module._extensions..js (node:internal/modules/cjs/loader:1435:10)
at Module.load (node:internal/modules/cjs/loader:1207:32)
at Module._load (node:internal/modules/cjs/loader:1023:12)
at Module.require (node:internal/modules/cjs/loader:1235:19)
at require (node:internal/modules/helpers:176:18)
at Service.loadUserOptions (D:\java\Develop\learn\vue-vue\vue\node_modules\@vue\cli-service\lib\Service.js:283:22)
at Service.init (D:\java\Develop\learn\vue-vue\vue\node_modules\@vue\cli-service\lib\Service.js:72:30)
at Service.run (D:\java\Develop\learn\vue-vue\vue\node_modules\@vue\cli-service\lib\Service.js:204:10)
首先他報的是一個:defineConfig is not a function,檢查你的vue.config.js文件,看是不是格式不正確才導(dǎo)致的報錯。
不管下面的邏輯,前兩行一定要定義正確
// vue.config.js const { defineConfig } = require('@vue/cli-service'); export default defineConfig({ // 這里放置你的配置選項 });
如果確實是正確的,格式一模一樣,那就看是不是node.js和npm的版本問題。
直接把node.js升級到最高級,打開node.js的官網(wǎng):
https://nodejs.org/
然后直接點擊下載,然后無腦下一步即可,不過要記住路徑。
然后以管理員身份打開cmd或者powerShell
輸入下面指令,升級npm,確保和node.js版本匹配:
npm install -g npm
然后清除緩存
npm cache clean -f
然后安裝yarn(已經(jīng)有的不必進(jìn)行這一步)
npm install -g yarn
然后在項目下重新執(zhí)行編譯命令:
yarn install
到這一步,已經(jīng)有很多人已經(jīng)解決問題了,但是還有一部分人遇到了新問題:
yarn : 無法加載文件 D:\APP\NodeJs\yarn.ps1,因為在此系統(tǒng)上禁止運行腳本。有關(guān)詳細(xì)信息,請參閱 https:/go.microsoft.com/fwlink/?LinkID=135170 中的 about_Execution_Policies。 所在位置 行:1 字符: 1 + yarn install + ~~~~ + CategoryInfo : SecurityError: (:) [],PSSecurityException + FullyQualifiedErrorId : UnauthorizedAccess
不管是yarn還是npm,遇到這個問題,需要以管理員身份打開PowerShell:
然后輸入:
Set-ExecutionPolicy RemoteSigned
回車
輸入y即可。
這時候99%的問題都解決了,如果還是還是不行,還是報錯,那就在當(dāng)前項目控制臺輸入這串指令:
yarn add --dev @vue/cli-service
你會發(fā)現(xiàn)問題解決了,再次編譯也通過了,并且輸入npm run serve也可以跑起來了,但是你又發(fā)現(xiàn)了,停掉之后,再跑一遍,又報錯了,你再輸一遍,就又可以了。
或者,又雙叒叕,還是報錯,王牌還得是他:
在當(dāng)前的項目下,輸入這一行指令:
Remove-Item -Recurse -Force node_modules
我們直接使用命令把當(dāng)前項目的依賴刪掉,重新下載。
然后你就發(fā)現(xiàn)idea彈窗提醒了,不必理會,直接npm install或者yarn install重新編譯即可。
總結(jié)
到此這篇關(guān)于vue前端編譯報錯解決的文章就介紹到這了,更多相關(guān)vue前端編譯報錯解決內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
Vue使用video標(biāo)簽實現(xiàn)視頻播放
這篇文章主要為大家詳細(xì)介紹了Vue使用video標(biāo)簽實現(xiàn)視頻播放,文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下2021-09-09elementui使用el-upload組件實現(xiàn)自定義上傳的詳細(xì)步驟
upload上傳是前端開發(fā)很常用的一個功能,在Vue開發(fā)中常用的Element組件庫也提供了非常好用的upload組件,這篇文章主要給大家介紹了關(guān)于elementui使用el-upload組件實現(xiàn)自定義上傳的詳細(xì)步驟,需要的朋友可以參考下2023-12-12element-ui 表格數(shù)據(jù)時間格式化的方法
這篇文章主要介紹了element-ui 表格數(shù)據(jù)時間格式化的方法,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2018-08-08