例如:
import Component from '@/components/component'
在我看到的代码中，它表现得像../在目录中上升了一层相对于文件路径，但我想知道它是做什么的。不幸的是，由于符号搜索问题，我在网上找不到任何文档。
当前回答
模块标识符的含义和结构取决于模块加载器或模块绑定器。模块加载器不是ECMAScript规范的一部分。从JavaScript语言的角度来看，模块标识符是完全不透明的。所以这实际上取决于你使用的是哪个模块加载器/绑定器。
你很可能在webpack/babel配置中有类似babel-plugin-root-import的东西。
基本上，这意味着从项目的根源…它避免了从'../../../ components/ Component '中导入Component之类的东西
编辑:它存在的一个原因是因为import Component from 'components/ Component '没有这样做，而是在node_modules文件夹中搜索
其他回答
模块标识符的含义和结构取决于模块加载器或模块绑定器。模块加载器不是ECMAScript规范的一部分。从JavaScript语言的角度来看，模块标识符是完全不透明的。所以这实际上取决于你使用的是哪个模块加载器/绑定器。
你很可能在webpack/babel配置中有类似babel-plugin-root-import的东西。
基本上，这意味着从项目的根源…它避免了从'../../../ components/ Component '中导入Component之类的东西
编辑:它存在的一个原因是因为import Component from 'components/ Component '没有这样做，而是在node_modules文件夹中搜索
如果你正在使用Typescript，你可以通过简单地使用你的tsconfig来实现。Json是这样的:
{
"compilerOptions": {
...
"baseUrl": ".",
"paths": {
"@lib/*": ["app/lib/*"]
}
},
}
知道它很老了，但我不确定它是如何定义的，所以查了一下，来了，深挖了一点，最后在我的Vue-CLI (Vue.js)生成的Webpack配置中找到了它
resolve: {
extensions: ['.js', '.vue', '.json'],
alias: {
'@': path.join(__dirname, '..', dir)
}
},
因此，它是一个别名，在本例中指向vue-cli生成的项目SRC目录的根目录
更新:正如@aderchox在评论中正确提到的，这是一个通用的Webpack功能，并不局限于Vue
我使用VS代码来构建react原生应用程序。
你需要的是:
创建一个jsconfig。json在你的应用的根路径下
在jsconfig中。Json，添加以下代码:
{
"compilerOptions": {
"baseUrl": ".",
"target": "ES6",
"module": "commonjs",
"paths": {
"@/*": ["src/*"],
"@components/*": ["src/components/*"],
"@core/*": ["src/core/*"]
}
},
"exclude": ["node_modules"]
}
基本上就像"shortcut": ["abs_path"]
为了让本的回答更全面:
首先你需要在你的devDependencies包中添加babel-plugin-root-import。如果使用yarn: yarn添加babel-plugin-root-import——dev)。 然后在你的.babelrc中将以下代码行添加到插件键中:
"plugins": [
[
"babel-plugin-root-import",
{
"rootPathPrefix": "@"
}
]
]
现在，你可以使用@。例如:
而不是
从“../../utils/somefile”导入xx
你可以
从“@/utils/somefile”导入xx
