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 上的新构建进行了更改...并且它像魔术一样奏效了!
我在 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 上的新构建进行了更改...并且它像魔术一样奏效了!