配置路径别名(@)

56 阅读1分钟
  1. webpack 在vue.config.js配置(如果没有该文件,直接新建一个即可):
const path = require("path");
function resolve(dir) {
  return path.join(__dirname, dir);
}

module.exports = {
  lintOnSave: process.env.NODE_ENV === "development",
  configureWebpack: {
    resolve: {
      alias: {
        "@": resolve("src"),
      },
    },
  },
};
  1. vite vite.config.ts

import path from "path"; 若报错就安装@types/node

import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import path from 'path';

// https://vite.dev/config/
export default defineConfig({
	plugins: [vue()],
	resolve: {
		alias: {
			'@': path.resolve(__dirname, 'src'),
		},
	},
});


vscode路径提示 配置tsconfig.app.json

{ 
  "compilerOptions": {
    //配置 @
    "baseUrl": ".",
    "paths": {
	    "@/*": ["src/*"]
    }
  },
  "files": [],
  "references": [
    { "path": "./tsconfig.app.json" },
    { "path": "./tsconfig.node.json" }
  ]
}