问题描述
我想在 Gatsby 项目中使用 jsdom,以便能够在 React 组件中加载和呈现单独的网页。
但是,当我尝试使用 Gatsby 进行构建时,出现了一系列 Webpack 错误,如下所示:
未定义失败
无法解析“child_process” '/Users/john/WebstormProjects/analytics/web/node_modules/jsdom/lib/jsdom/living/xhr'
我认为这可能是因为 Webpack 使用的是“web”目标模式而不是“节点”。我试过在根目录中放置一个 webpack.config.js
文件:
module.exports = {
target: 'node',}
然而,这没有任何作用。我也尝试使用 onCreateWebpackConfig
,但我不确定这是否正确,因为我也无法使其正常工作:
//gatsby-node.ts
export { onCreateWebpackConfig } from "./src/gatsby/on-create-webpack-config";
// ./src/gatsby/on-create-webpack-config
export const onCreateWebpackConfig = ({ actions } : any) => {
actions.setWebpackConfig({
target: 'node',});
}
我有两个问题:
-
是否可以在 Gatsby 项目中使用
jsdom
,如果可以,我需要做什么?如果只是为了使用target
模式,那么: -
如何将 Gatsby 中的
target
模式设置为node
而不是web
?
解决方法
- 如何在 Gatsby 中将目标模式设置为节点而不是网络?
看起来您可以更改 webpack 配置来设置目标:
// gatsby-node.js
exports.onCreateWebpackConfig = ({ actions,getConfig }) => {
const config = getConfig();
config.target = 'node';
actions.replaceWebpackConfig(config);
};