vue-cli創(chuàng)建項(xiàng)目ERROR?in?Conflict:?Multiple?assets?emit?different?content?to?the?same?filename?index.html問(wèn)題的解決辦法
Ⅰ、所遇問(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ī)則;
V、小結(jié):
到此這篇關(guān)于vue-cli創(chuàng)建項(xiàng)目ERROR in Conflict: Multiple assets emit different content to the same filename index.html問(wèn)題的解決辦法的文章就介紹到這了,更多相關(guān)vue-cli創(chuàng)建項(xiàng)目ERROR in Conflict內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
- 使用vue-cli創(chuàng)建vue2項(xiàng)目的實(shí)戰(zhàn)步驟詳解
- vue-cli腳手架創(chuàng)建項(xiàng)目遇到的坑及解決
- 五分鐘教你使用vue-cli3創(chuàng)建項(xiàng)目(新手入門(mén))
- vue-cli創(chuàng)建的項(xiàng)目中的gitHooks原理解析
- vue-cli3.X快速創(chuàng)建項(xiàng)目的方法步驟
- 使用vue-cli3 創(chuàng)建vue項(xiàng)目并配置VS Code 自動(dòng)代碼格式化 vue語(yǔ)法高亮問(wèn)題
- vue-cli是什么及創(chuàng)建vue-cli項(xiàng)目的方法
相關(guān)文章
vue如何使用mapbox對(duì)當(dāng)前行政區(qū)劃進(jìn)行反選遮罩
這篇文章主要介紹了vue如何使用mapbox對(duì)當(dāng)前行政區(qū)劃進(jìn)行反選遮罩問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-10-10
JavaScript的Vue.js庫(kù)入門(mén)學(xué)習(xí)教程
Vue的很多思想借鑒于Angular,但卻比較輕量和自由,這里我們整理了JavaScript的Vue.js庫(kù)入門(mén)學(xué)習(xí)教程,包括其架構(gòu)思想與核心的數(shù)據(jù)綁定方式等,需要的朋友可以參考下2016-05-05
npm run serve運(yùn)行vue項(xiàng)目時(shí)報(bào)錯(cuò):Error: error:0308010C
這篇文章主要介紹了npm run serve運(yùn)行vue項(xiàng)目時(shí),出現(xiàn)報(bào)錯(cuò):Error: error:0308010C:digital envelope routines::unsupported的解決方法,文中有詳細(xì)的解決方法,需要的朋友可以參考下2024-04-04
vue+vuex+axios實(shí)現(xiàn)登錄、注冊(cè)頁(yè)權(quán)限攔截
下面小編就為大家分享一篇vue+vuex+axios實(shí)現(xiàn)登錄、注冊(cè)頁(yè)權(quán)限攔截,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-03-03
vue-cli-service build 環(huán)境設(shè)置方式
這篇文章主要介紹了vue-cli-service build 環(huán)境設(shè)置方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。2023-01-01
vue 解決移動(dòng)端彈出鍵盤(pán)導(dǎo)致頁(yè)面fixed布局錯(cuò)亂的問(wèn)題
今天小編就為大家分享一篇vue 解決移動(dòng)端彈出鍵盤(pán)導(dǎo)致頁(yè)面fixed布局錯(cuò)亂的問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-11-11
vue自定義權(quán)限指令的實(shí)現(xiàn)
本文主要介紹了vue自定義權(quán)限指令的實(shí)現(xiàn)2024-05-05
詳解基于vue-cli3快速發(fā)布一個(gè)fullpage組件
這篇文章主要介紹了詳解基于vue-cli3快速發(fā)布一個(gè)fullpage組件,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2019-03-03
nuxt.js 在middleware(中間件)中實(shí)現(xiàn)路由鑒權(quán)操作
這篇文章主要介紹了nuxt.js 在middleware(中間件)中實(shí)現(xiàn)路由鑒權(quán)操作,具有很好的參考價(jià)值,希望大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-11-11
vue運(yùn)行報(bào)錯(cuò)cache-loader的解決步驟
最近運(yùn)行vue項(xiàng)目的時(shí)候報(bào)錯(cuò)了,通過(guò)查找相關(guān)資料最終解決,下面這篇文章主要給大家介紹了關(guān)于vue運(yùn)行報(bào)錯(cuò)cache-loader的解決步驟,文中通過(guò)代碼介紹的非常詳細(xì),需要的朋友可以參考下2024-02-02

