vue3+vite3.0项目支持路径别名

Frank原创
  • 开发笔记
  • Vue
  • vite3
  • vue3
小于 1 分钟约 153 字...

让编辑器认识@

修改 jsconfig.json

{
  "compilerOptions": {
    "baseUrl": "./",
    "paths": {
      "@/*": ["src/*"]
    }
  }
}

让 vite 认识@

注意事项

  1. 不能在 vite.config.js 使用@导入文件
  2. 使用 commonjs 语法导入 path 模块会报错,使用 import 语法导入,又会报__dirname is not defined in ES module scope,在 vue2+webpack 这样做是可以正确运行的。vite 项目不可以,现在下面这种方式可以正确运行。

修改 vite.config.js

import path from 'path'

import { fileURLToPath } from 'url'

const __newDirname = path.dirname(fileURLToPath(import.meta.url))

export default defineConfig({
  resolve: {
    alias: {
      '@': path.resolve(__newDirname, 'src'),
    },
  },
})
上次编辑于:
评论
  • 按正序
  • 按倒序
  • 按热度
Powered by Waline v2.14.1