Netlify - Gatsby 别名导入不起作用

Netlify - Gatsby alias imports not working

我在 Netlify 构建日志中收到此错误:

2:24:32 AM: error Generating JavaScript bundles failed
2:24:32 AM: Can't resolve '@layout/PageContainer' in '/opt/build/repo/src/pages/how-it-works'
2:24:32 AM: If you're trying to use a package make sure that '@layout/PageContainer' is installed. If you're trying to use a local file make sure that the path is correct.
2:24:32 AM: error Generating JavaScript bundles failed
2:24:32 AM: Can't resolve '@pages/HowItWorks' in '/opt/build/repo/src/pages/how-it-works'
2:24:32 AM: If you're trying to use a package make sure that '@pages/HowItWorks' is installed. If you're trying to use a local file make sure that the path is correct.

我已经像这样设置了 webpack 别名:

// gatsby-node.js
exports.onCreateWebpackConfig = ({ stage, actions }) => {
    actions.setWebpackConfig({
        resolve: {
            modules: [path.resolve(__dirname, "src"), "node_modules"],
            alias: {
                "@pages": path.resolve(__dirname, "src/components/pages/"),
                "@layout": path.resolve(__dirname, "src/components/layout/"),
            },
            extensions: [".js", ".json", ".jsx", ".tsx", ".ts"]
        }
    });
};

@pages 文件结构如下:src -> components -> pages

@layout 文件结构如下:src -> components -> layout

我可以在本地 yarn build 我的回购。没问题。

一旦我尝试 deploy/build 使用 Netlify,我就遇到了这个别名问题。为什么这不适用于 Netlify?

我终于成功了,但我不知道为什么会成功!!

根据我在这上面花了太多时间并尝试了 100 种不同的东西,我发现.. Ubuntu 文件系统的行为与 Macs/Windows 这就是为什么我能够毫无问题地在本地构建(我正在使用 Windows)。 Netlify 使用 Ubuntu 图像来构建,因此没有使用其他东西的选项。

这与此处提到的类似:https://github.com/gatsbyjs/gatsby/issues/2897

这是我解决问题的方法:

Rename affected directories:

FROM:
src/components/layout
src/components/pages

TO:
src/components/Layout
src/components/Pages

And then I changed my alias's accordingly:

"@Pages": path.resolve(__dirname, "src/components/Pages")
"@Layout": path.resolve(__dirname, "src/components/Layout")

在此之后,我对 git 和 运行 Netlify 上的新构建进行了更改...并且它像魔术一样奏效了!