Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

vite.config 配置 resolve.alias 解析编译不报错 #4257

Closed
6 tasks done
iDerekLi opened this issue Jul 15, 2021 · 5 comments
Closed
6 tasks done

vite.config 配置 resolve.alias 解析编译不报错 #4257

iDerekLi opened this issue Jul 15, 2021 · 5 comments

Comments

@iDerekLi
Copy link

Describe the bug

vite.config 配置 resolve.alias 使用错误路径时解析编译不报错

Reproduction

  1. 使用 vite cli 工具创建一个项目。
  2. 在 vite.config.js 添加
import { resolve } from 'path'

export default defineConfig({
  // ...省略
  resolve: {
    alias: {
      '@': resolve(__dirname, 'src')
    }
  }
})
  1. 修改依赖地址
// 原始, 例如:当去除 `.vue` 后缀时终端和浏览器提示错误信息。
import HelloWorld from "../components/HelloWorld.vue";

// 修改,例如:当去除 `.vue` 后缀时终端和浏览器无提示错误信息。
import HelloWorld from "@/components/HelloWorld.vue";

有信息效果
image
无信息效果
image

System Info

System:
    OS: Windows 10 10.0.22000
    CPU: (8) x64 AMD Ryzen 5 3500U with Radeon Vega Mobile Gfx
    Memory: 535.72 MB / 6.94 GB
  Binaries:
    Node: 12.15.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.5 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
    npm: 6.13.4 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.22000.1.0), Chromium (91.0.864.67)
    Internet Explorer: 11.0.22000.1
  npmPackages:
    @vitejs/plugin-vue: ^1.2.4 => 1.2.5
    vite: ^2.4.0 => 2.4.2

Used Package Manager

yarn

Logs

No response

Validations

@daiwanxing
Copy link

建议开一个repo

@ygj6
Copy link
Member

ygj6 commented Jul 15, 2021

Maybe related to #3532

@snowdream
Copy link

@iDerekLi 我按照这个配置成功了。
资料来源:https://wym.keaiduo.plus/2021/05/21/%E5%9C%A8vite%E4%B8%AD%E8%AE%BE%E7%BD%AEalias%E5%88%AB%E5%90%8D/

//tsconfig.json 
"paths": {
   "/@/*": ["src/*"],
   "/@components/*": ["src/components/*"]
 }
   
   //vite.config.ts
   const { resolve } = require("path");
   //引入resole
   //如果报错 请 yarn add @types/node -D
   resolve: {
   alias: {
     "/@": resolve(__dirname, "./src"),
     "/@components": resolve(__dirname, "./src/components"),
   },
 },

@lp13762436965
Copy link

@iDerekLi 我按照这个配置成功了。 资料来源:https://wym.keaiduo.plus/2021/05/21/%E5%9C%A8vite%E4%B8%AD%E8%AE%BE%E7%BD%AEalias%E5%88%AB%E5%90%8D/

//tsconfig.json 
"paths": {
   "/@/*": ["src/*"],
   "/@components/*": ["src/components/*"]
 }
   
   //vite.config.ts
   const { resolve } = require("path");
   //引入resole
   //如果报错 请 yarn add @types/node -D
   resolve: {
   alias: {
     "/@": resolve(__dirname, "./src"),
     "/@components": resolve(__dirname, "./src/components"),
   },
 },

@iDerekLi 我按照这个配置成功了。 资料来源:https://wym.keaiduo.plus/2021/05/21/%E5%9C%A8vite%E4%B8%AD%E8%AE%BE%E7%BD%AEalias%E5%88%AB%E5%90%8D/

//tsconfig.json 
"paths": {
   "/@/*": ["src/*"],
   "/@components/*": ["src/components/*"]
 }
   
   //vite.config.ts
   const { resolve } = require("path");
   //引入resole
   //如果报错 请 yarn add @types/node -D
   resolve: {
   alias: {
     "/@": resolve(__dirname, "./src"),
     "/@components": resolve(__dirname, "./src/components"),
   },
 },

我也配置成功了 但是还是ts报错 , 但是可以使用别名了

@bluwy
Copy link
Member

bluwy commented Mar 13, 2022

I tested this locally and it's working fine for me. Perhaps it's something in the project setup that's interfering it, ad if so please provide a reproduction repo/stackblitz. Thanks!

@bluwy bluwy closed this as completed Mar 13, 2022
@github-actions github-actions bot locked and limited conversation to collaborators Mar 28, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

6 participants