快捷導(dǎo)航

vite+vue3使用@路徑報(bào)錯(cuò)處理

更新時(shí)間：2023年11月20日 09:51:27 作者：云隙陽(yáng)光i

本文主要介紹了vite+vue3使用@路徑報(bào)錯(cuò)處理,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧

處理方法：

安裝path模塊：

npm install --save-dev @types/node

修改vite.config.ts

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'path'
 
// https://vitejs.dev/config/
export default defineConfig({
  plugins: [vue()],
  server: {
    host: '0.0.0.0'
  },
  resolve: {
    alias: {
      '@': path.resolve(__dirname, 'src')
    }
  }
})

修改tsconfig.json：

配置 baseUrl、paths

{
  "compilerOptions": {
    "target": "ESNext",
    "useDefineForClassFields": true,
    "module": "ESNext",
    "moduleResolution": "Node",
    "strict": true,
    "jsx": "preserve",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "esModuleInterop": true,
    "lib": ["ESNext", "DOM"],
    "skipLibCheck": true,
    "noEmit": true,
    "baseUrl": ".",
    "paths": {
      "@/*": ["src/*"]
    }
  },
  "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
  "references": [{ "path": "./tsconfig.node.json" }]
}

最后重新運(yùn)行項(xiàng)目

到此這篇關(guān)于vite+vue3使用@路徑報(bào)錯(cuò)處理的文章就介紹到這了,更多相關(guān)vite vue3 @路徑報(bào)錯(cuò)內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章:

相關(guān)文章

關(guān)于Vue Webpack2單元測(cè)試示例詳解
這篇文章主要給大家介紹了關(guān)于Vue Webpack2單元測(cè)試的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面跟著小編來一起學(xué)習(xí)學(xué)習(xí)吧。
2017-08-08
Element-Plus的ClickOutside指令導(dǎo)致內(nèi)存泄漏的解決辦法
這篇文章給大家介紹了Element-Plus的ClickOutside指令導(dǎo)致內(nèi)存泄漏的解決辦法,文中給出了詳細(xì)的解決辦法,遇到同樣問題的小伙伴可以參考閱讀一下本文
2024-01-01
解決Element中el-date-picker組件不回填的情況
這篇文章主要介紹了解決Element中el-date-picker組件不回填的情況，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
2020-11-11
vue總線機(jī)制(bus)知識(shí)點(diǎn)詳解
在本篇文章中小編給大家整理的是關(guān)于vue總線機(jī)制(bus)知識(shí)點(diǎn)總結(jié)，有興趣的朋友們可以跟著學(xué)習(xí)下。
2020-05-05
elementUI vue this.$confirm 和el-dialog 彈出框移動(dòng) 示例demo
這篇文章主要介紹了elementUI vue this.$confirm 和el-dialog 彈出框移動(dòng) 示例demo，本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
2019-07-07
Element el-menu中NavMenu的用法
今天封裝一個(gè)導(dǎo)航欄的組件,使用的Element的NavMenu組件。遇到一個(gè)問題，本文主要介紹了Element el-menu中NavMenu的用法，感興趣的可以了解一下
2023-04-04
Vue 實(shí)例事件簡(jiǎn)單示例
這篇文章主要介紹了Vue 實(shí)例事件,結(jié)合簡(jiǎn)單示例形勢(shì)分析了vue.js事件響應(yīng)與頁(yè)面元素相關(guān)操作技巧,需要的朋友可以參考下
2019-09-09
vue實(shí)現(xiàn)高德地圖添加多個(gè)點(diǎn)標(biāo)記
地圖多點(diǎn)標(biāo)注其實(shí)是個(gè)非常簡(jiǎn)單的問題,這篇文章主要給大家介紹了關(guān)于vue實(shí)現(xiàn)高德地圖添加多個(gè)點(diǎn)標(biāo)記的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下
2023-06-06
vue?router權(quán)限管理實(shí)現(xiàn)不同角色顯示不同路由
本文主要介紹了vue?router權(quán)限管理實(shí)現(xiàn)不同角色顯示不同路由，文中通過示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2022-03-03
深入理解Vue 的條件渲染和列表渲染
本篇文章主要介紹了深入理解Vue 的條件渲染和列表渲染，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2017-09-09