在从“@/ HomePage”导入{}时，这是什么？

Question

我知道它导入了一个文件，但我不知道"@“代表什么，我看到了一堆使用相同语法的代码片段。

我尝试以任何我认为可能的方式实现相同的场景，但仍然没有成功。

Answer 1

它们是webpack别名导入，这种配置有助于缩短您的绝对/相对路径。

在这里阅读更多信息：https://webpack.js.org/configuration/resolve/

Answer 2

当您想要使用范围包时，将使用此选项。

什么是范围包？also是将相关包组合在一起的一种方法，它还会影响npm对待包的方式。

请查查这份文件

Answer 3

首先，您需要将babel-plugin-root-import添加到devDependencies中的package.json中(如果使用yarn: yarn add babel-plugin-root-import --dev)。然后在.babelrc中将以下行添加到plugins键中：

"plugins": [
[
  "babel-plugin-root-import",
  {
    "rootPathPrefix": "@"
  }
]
]

现在，您可以使用@. (例如：

而不是：

import xx from '../../utils/somefile'

你可以：

import xx from '@/utils/somefile'