javascript - 导入 ES6 : Giving an Alias Name to the Package

Question

请看下面的导入语句:

import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'

是否可以为正在导入的包 的名称提供别名——即，在本例中为@fortawesome/react-fontawesome。 这样我就不必每次都写出整个项目名称。

为了清楚起见，我正在寻找可以执行以下操作的最终结果:

import { FontAwesomeIcon } from 'fa'

或者这个

import { FontAwesomeIcon } from '@custom/fa'

With fa(或@custom/fa)是我创建的一个名称，它引用了实际的@fortawesome/react-fontawesome 库.

这可能吗？如果是，怎么办？

Answer 1

我假设您正在使用 webpack。如果是这样，您可以使用 Webpack.resolve功能。你只需要编辑你的 webpack.config.js 并像下面这样设置:

// webpack.config.js
module.exports = {
    //...
    resolve: {
        alias: {
            fa: path.resolve(__dirname, '@fortawesome/react-fontawesome')
        }
    }
    //...
}

你的导入会变成

import { FontAwesomeIcon } from 'fa'