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