关于src别名的配置之tsconfig.json配置

tsconfig.json


{
  "compilerOptions": {
    "baseUrl": "./", // 解析非相对模块的基地址,默认是当前目录
    "paths": { //路径映射,相对于baseUrl
      "@/*": ["src/*"] 
    }
  }
}

① "baseUrl": "./"

  • baseUrl 表示解析非相对模块(即不以 ./../ 开头的模块)的基地址,默认是当前目录。
  • 在这个配置中,baseUrl 设置为 ./,表示非相对模块的解析基地址为当前目录。

PS:

  • baseUrl 的值是相对于 tsconfig.json 文件所在的目录的路径。在这个配置中,"./" 表示基础路径是当前 tsconfig.json 文件所在的目录。

  • 解析非相对模块:当 TypeScript 编译器遇到 importrequire 语句引用一个非相对路径的模块时,它会使用 baseUrl 作为起点,拼接上模块的相对路径,以解析最终的文件路径。

    • 例如,如果 baseUrl./src,而你引用了 import MyModule from 'components/MyModule';,那么 TypeScript 将尝试从 ./src/components/MyModule 处解析模块。

② "paths": {"@/*": ["src/*"]}

  • paths 是路径映射的配置,允许你为模块路径设置别名。
  • 在这个配置中,"@/*" 是别名,["src/*"] 是与别名对应的实际路径。这表示以 @/ 开头的模块路径将被映射到 src/ 目录下。

你可能感兴趣的:(vue3+ts项目记录,前端)