控制臺報錯：（其他報錯信息往下滑，下面的解決方法可以解決大部分的報錯，不只是這一種） 

 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({
  // 這里放置你的配置選項(xiàng)
});

如果確實(shí)是正確的，格式一模一樣，那就看是不是node.js和npm的版本問題。

直接把node.js升級到最高級，打開node.js的官網(wǎng)：

https://nodejs.org/

然后直接點(diǎn)擊下載，然后無腦下一步即可，不過要記住路徑。

然后以管理員身份打開cmd或者powerShell

輸入下面指令，升級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ì)信息，請參閱 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)前項(xiàng)目控制臺輸入這串指令：

yarn add --dev @vue/cli-service

你會發(fā)現(xiàn)問題解決了，再次編譯也通過了，并且輸入npm run serve也可以跑起來了，但是你又發(fā)現(xiàn)了，停掉之后，再跑一遍，又報錯了，你再輸一遍，就又可以了。

或者，又雙叒叕，還是報錯，王牌還得是他：

在當(dāng)前的項(xiàng)目下，輸入這一行指令：

Remove-Item -Recurse -Force node_modules 

我們直接使用命令把當(dāng)前項(xiàng)目的依賴刪掉，重新下載。 

 然后你就發(fā)現(xiàn)idea彈窗提醒了，不必理會，直接npm install或者yarn install重新編譯即可。

總結(jié)

到此這篇關(guān)于vue前端編譯報錯解決的文章就介紹到這了,更多相關(guān)vue前端編譯報錯解決內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評論