我不知道如何解决这个问题，但我尝试了很多可能只是愚蠢的事情。我只想完成将我的react应用程序更改为react静态应用程序，这样我就可以完成我的项目了。Everething在本地工作，我知道它与服务器端JS和客户端JS有关，但我不知道从哪里开始。请帮忙。
这是我从常规纱线构建中得到的错误：
[ERR_REQUIRE_ESM]: Must use import to load ES Module:
C:my-projoectnode_modules@babelruntimehelpersesmobjectWithoutPropertiesLoose.js
require() of ES modules is not supported.
require() of C:my-projoectnode_modules@babelruntimehelpersesmobjectWithoutPropertiesLoose.js
from C:moji-projekt irost-staticnode_modulesreact-springrenderprops.js is an ES module file as
it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js
files in that package scope as ES modules.
Instead rename objectWithoutPropertiesLoose.js to end in .cjs, change the requiring code to use
import(), or remove "type": "module" from
C:my-projoectnode_modules@babelruntimehelpersesmpackage.json.
当我运行yarn build--debug:时，我会得到这样的结果
ReferenceError: window is not defined
没有任何迹象表明问题出在哪里。我已经在我的项目周围放置了if(typeof window === "undefined") return null;，但运气不好。
这是我的包.json，以防它可以帮助解决这个问题：
{
"name": "rost-react-static",
"private": true,
"scripts": {
"start": "react-static start",
"stage": "react-static build --staging",
"build": "react-static build",
"analyze": "react-static build --analyze",
"serve": "serve dist -p 3000"
},
"dependencies": {
"@reach/router": "^1.3.4",
"@rooks/use-window-size": "^4.8.0",
"@tinymce/tinymce-react": "^3.10.1",
"@types/react": "^16.8.6",
"axios": "^0.21.1",
"bootstrap": "^4.5.3",
"dotenv": "^8.2.0",
"emailjs-com": "^2.6.4",
"firebase": "^8.0.0",
"particles-bg": "^2.5.0",
"react": "^16.14.0",
"react-bootstrap": "^1.4.0",
"react-dom": "^16.14.0",
"react-ga": "^3.3.0",
"react-google-recaptcha": "^2.1.0",
"react-google-recaptcha-v3": "^1.7.0",
"react-helmet": "^6.1.0",
"react-hot-loader": "^4.13.0",
"react-html-parser": "^2.0.2",
"react-icons": "^4.2.0",
"react-particle-image": "^1.0.1",
"react-phone-number-input": "^3.1.10",
"react-player": "^2.7.0",
"react-redux": "^7.2.2",
"react-spring": "^8.0.27",
"react-static": "^7.5.1",
"react-static-plugin-reach-router": "^7.5.1",
"react-static-plugin-sass": "^7.3.0",
"react-static-plugin-sitemap": "^7.5.1",
"react-static-plugin-source-filesystem": "^7.5.1",
"recaptcha-v3": "^1.8.0",
"redux": "^4.0.5",
"redux-thunk": "^2.3.0",
"web-vitals": "^0.2.4"
},
"devDependencies": {
"@types/react": "^16.8.6",
"babel-eslint": "^10.1.0",
"eslint": "^7.20.0",
"eslint-config-react-app": "^6.0.0",
"eslint-config-react-tools": "^1.1.7",
"eslint-plugin-flowtype": "^5.2.2",
"eslint-plugin-import": "^2.22.1",
"eslint-plugin-jsx-a11y": "^6.4.1",
"eslint-plugin-react": "^7.22.0",
"eslint-plugin-react-hooks": "^4.2.0",
"serve": "^11.3.2"
}
}
我假设您错过了对窗口的一些引用，或者在您正在使用的某个模块中有对窗口的某些引用。
根据反应静态文档：
"因为React静态代码在运行时同时在浏览器中使用，在构建和导出时也在节点中使用，所以所有代码都是"；通用的"；或者换句话说；节点安全">
https://github.com/react-static/react-static/blob/master/docs/concepts.md#writing-通用节点安全码
所以检查窗口的类型，为我修复了这个。
//工作
const browserVar = typeof window !== 'undefined' && window.method ? 'browser' : 'node'
//不起作用
const browserVar = window && window.method ? 'browser' : 'node'