使用vite創(chuàng)建vue3之vite.config.js的配置方式
更新時間：2024年08月07日 09:28:00 作者：ing*_*
這篇文章主要介紹了使用vite創(chuàng)建vue3之vite.config.js的配置方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教
使用vite創(chuàng)建vue3之vite.config.js配置
都是自我的學(xué)習(xí)中理解，有不對的不到位的歡迎大佬們指出。
參考文件：Node.js中文網(wǎng)
創(chuàng)建文件后原始內(nèi)容
知識點
url.fileURLToPath()函數(shù)字面意思就是把文件URL解碼為路徑字符串，并給定的文件URL轉(zhuǎn)換為路徑時正確地附加/調(diào)整了URL控制字符 (/，％)。
首先要明白在nodejs中path模塊的導(dǎo)入方式 :
在vue cli 使用webpack環(huán)境中:
const path = require('path')
const pathName = path.join(__dirname,'index.html')但是在vite中使用上面的導(dǎo)入方式就會發(fā)現(xiàn)vite在ES 模塊里面沒有定義require,需要用import來代替。
import path from 'path'
const pathImport = path.join(__dirname,'index.html')使用import也會報錯的哦，__dirname is nodt defined in ES module scope。
alias 別名，resolve.alias,兩種類型，一個是對象的類型，另一個是數(shù)組的類型。
// 第一種寫法
resolve: { alias: { '@': fileURLToPath(new URL('./src', import.meta.url))}}
// 第二種寫法
resolve: {alias: [{ find:'@', replacement: fileURLToPath(new URL('./src', import.meta.url))}] }代理配置
總結(jié)
以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
elementUI表格多選框this.$refs.xxx.toggleRowSelection無效問題
這篇文章主要介紹了elementUI表格多選框this.$refs.xxx.toggleRowSelection無效問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2023-11-11
X6 是 AntV 旗下的圖編輯引擎，提供了一系列開箱即用的交互組件和簡單易用的節(jié)點定制能力，方便我們快速搭建流程圖、DAG 圖、ER 圖等圖應(yīng)用。接下來就看看vue如何使用它2021-05-05
有時候我們使用el-table的選擇框時,如果涉及修改、刪除時,可能一次只允許用戶選擇一條,這樣的話如果使用頂部的全選復(fù)選框就不合適了,這篇文章主要給大家介紹了關(guān)于el-table表頭全選框隱藏或禁用設(shè)置的相關(guān)資料,需要的朋友可以參考下2023-09-09
這篇文章主要介紹了Vue3+ElementPlus 表單組件的封裝實例，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-06-06
這篇文章主要給大家介紹了關(guān)于Vue虛擬Dom與diff算法的相關(guān)資料，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-08-08
Vue+Bootstrap收藏（點贊）功能邏輯與具體實現(xiàn)
這篇文章主要為大家詳細介紹了Vue+Bootstrap收藏（點贊）功能邏輯與具體實現(xiàn)，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-10-10
vue實現(xiàn)壓縮圖片預(yù)覽并上傳功能（promise封裝）
這篇文章主要為大家詳細介紹了vue實現(xiàn)壓縮圖片預(yù)覽并上傳功能，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-01-01
@font-face?是?CSS?中的一個規(guī)則,它允許你加載服務(wù)器上的字體文件（遠程或者本地）,并在網(wǎng)頁中使用這些字體,本文給大家介紹了Vue使用font-face自定義字體的案例,并通過代碼講解的非常詳細,需要的朋友可以參考下2024-03-03
本篇文章主要介紹了vue 實現(xiàn)全選全不選的示例代碼，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-03-03
路由守衛(wèi)又稱導(dǎo)航守衛(wèi)，指是路由跳轉(zhuǎn)前、中、后過程中的一些鉤子函數(shù),這篇文章主要介紹了Vue中的路由與多種守衛(wèi),需要的朋友可以參考下2023-02-02