vue-cli創(chuàng)建項(xiàng)目ERROR?in?Conflict:報(bào)錯(cuò)怎么解決

本文小編為大家詳細(xì)介紹“vue-cli創(chuàng)建項(xiàng)目ERROR in Conflict:報(bào)錯(cuò)怎么解決”，內(nèi)容詳細(xì)，步驟清晰，細(xì)節(jié)處理妥當(dāng)，希望這篇“vue-cli創(chuàng)建項(xiàng)目ERROR in Conflict:報(bào)錯(cuò)怎么解決”文章能幫助大家解決疑惑，下面跟著小編的思路慢慢深入，一起來(lái)學(xué)習(xí)新知識(shí)吧。

Ⅰ、所遇問(wèn)題簡(jiǎn)述：

1、問(wèn)題描述：

在用 vue-cli 正常來(lái)創(chuàng)建新的基于 vue2 框架 的項(xiàng)目，在安裝好 node-modules 之后，運(yùn)行命令 ‘npm run serve’ ,報(bào)錯(cuò)情況如下：

ERROR in Conflict: Multiple assets emit different content to the same filename index.html

沖突中的錯(cuò)誤：多個(gè)資產(chǎn)向相同的文件名 index.html 發(fā)出不同的內(nèi)容

2、問(wèn)題分析：

其一、創(chuàng)建項(xiàng)目的過(guò)程及命令是沒(méi)有問(wèn)題的，基于 vue2 框架的版本也沒(méi)有問(wèn)題，可以考慮是在創(chuàng)建項(xiàng)目中出現(xiàn)了中文名字的原因(因?yàn)榇隧?xiàng)目的上一層我用的是漢字)？

其二、文件的配置問(wèn)題，在腳手架進(jìn)行創(chuàng)建項(xiàng)目的時(shí)候，有關(guān)多個(gè)文件名重名了(報(bào)錯(cuò)是 index.html 文件發(fā)生沖突了)？

Ⅱ、解決問(wèn)題的兩種方案：

1、方案一、嘗試用純英文命名，避免中文命名的影響(成功解決了問(wèn)題)；

2、方案二、修改 index.html 文件名稱，以及 webpack 的相關(guān)配置文件(也成功解決了問(wèn)題);

Ⅲ、第一種方案的實(shí)施過(guò)程(即：將中文文件名修改為純英文文件名)：

1、報(bào)錯(cuò)項(xiàng)目存在的問(wèn)題：

該項(xiàng)目文件的上一層命名 存在中文文字；

2、問(wèn)題的解決過(guò)程：

將該項(xiàng)目文件名稱及該項(xiàng)目文件的上一層 命名為純英文，此時(shí)發(fā)現(xiàn)再運(yùn)行該項(xiàng)目后，能成功運(yùn)行；

3、該方法是解決該問(wèn)題的根本辦法

只有命名不包含中文，是不會(huì)在用 vue-cli 創(chuàng)建項(xiàng)目的時(shí)候報(bào)出該錯(cuò)誤的；

Ⅳ、第二種方案的實(shí)施過(guò)程(即：修改相關(guān)的 webpack 配置文件)：

1、把 index.html 文件重命名為 index.ejs 文件；

代碼：index.ejs 

2、在 node_nodules/webpack/bin/webpack.js 中加入 html: { template: './src/index.ejs' }

代碼： html: { template: './src/index.ejs' } 

3、重新輸入'npm run serve' 命令來(lái)運(yùn)行項(xiàng)目，發(fā)現(xiàn)能成功運(yùn)行，此時(shí)也就解決了該問(wèn)題；

4、該方法是解決該問(wèn)題的一種方案

該方案 只對(duì)該項(xiàng)目有用，并不能徹底解決所有的項(xiàng)目問(wèn)題，因此最好是遵守用純英文命名文件的規(guī)則。

讀到這里，這篇“vue-cli創(chuàng)建項(xiàng)目ERROR in Conflict:報(bào)錯(cuò)怎么解決”文章已經(jīng)介紹完畢，想要掌握這篇文章的知識(shí)點(diǎn)還需要大家自己動(dòng)手實(shí)踐使用過(guò)才能領(lǐng)會(huì)，如果想了解更多相關(guān)內(nèi)容的文章，歡迎關(guān)注億速云行業(yè)資訊頻道。