使用命令 npx create-next-app@latest
新建项目时,会自定义一些选项,如下图:
其中自定义导入别名的选项,选择Yes 或 No 有何区别?
Would you like to customize the default import alias (@/*)? ... No / Yes
一、选择 "Yes"
jsconfig.js
文件的内容是:
{
"compilerOptions": {
"paths": {
"@/*": ["./src/*"]
}
}
}
例如,有一个位于 src/components/layout.js 的文件,你可以使用 import Layout from '@/components/layout' 来导入。
二、选择 "No"
jsconfig.js
文件的内容是:
{
"compilerOptions": {
"paths": {
"@/*": ["./*"]
}
}
}
这种情况下,只能使用相对路径或者绝对路径导入文件。
三、如何配置导入别名
导入别名的设置并非必须项。当项目结构较为复杂时,设置导入别名可便捷开发。即使创建项目时,选择了"No",后续也可以通过修改jsconfig.js
文件来重新定义导入别名,还可以增加其他别名设置。案例如下:
{
"compilerOptions": {
"baseUrl": "./",
"paths": {
"@/*": ["src"],
"components/*": ["src/components/*"],
"pages/*": ["src/pages/*"],
"assets/*": ["src/assets/*"]
}
},
"exclude": ["node_modules", "dist"]
}
标签:src,自定义,No,default,别名,js,导入
From: https://www.cnblogs.com/amnesia999/p/18472453