React Webpack 4解析别名

Question

我在使用WebPack在我的React应用程序中使用解析别名时遇到困难,而我从谷歌搜索结果中尝试的所有内容似乎没有任何区别.

这是我对webpack的决心.

C:\网站\ webpack.config.js

resolve: {
    extensions: ['*', '.js', '.jsx'],
    alias: {
        apiAlias: path.resolve(__dirname, '/app/services/api/')
    }
}

这是C:\ website\app\components\Accounts\Accounts.js

import ApiAccounts from '/apiAlias/ApiAccounts.js';

我有一个位于C:\ website\app\services\api\ApiAccounts.js的文件将以上行改为以下作品:

import ApiAccounts from '../../services/api/ApiAccounts.js';

为了丰满,这是我的webpack依赖项:

"devDependencies": {
    "html-webpack-plugin": "^3.2.0",
    "webpack": "^4.12.0",
    "webpack-cli": "^3.0.3",
    "webpack-dev-server": "^3.1.4"
 }

但我一直得到错误

./app/components/Accounts/Accounts.js中的错误找不到模块:错误:无法解析'C:\ website\app\components\Accounts'中的'/apiAlias/ApiAccounts.js'

任何人都可以看到任何明显的我缺少的东西,或者应该尝试尝试让这个工作,或者即使有一种方法来调试webpack,看看它实际上使用的路径,如果别名实际上踢了？

谢谢!

Answer 1

我唯一缺少的是/ app前面的点！

apiAlias: path.resolve(__dirname, './app/services/api/')