问题描述
有三种情况。全部发生在 Window 10 WSL Ubuntu 上:
-
本周我使用
--template typescript
创建了一个新的 React 应用程序。yarn start
ing 后,各种编辑都不会触发任何热重载。 -
我
yarn start
编写了 2020 年 7 月创建的旧 React 应用(使用--template typescript
创建)。package.json
和tsconfig.json
上的配置没有修改自创建以来,但无法触发热重载。package.json(建于 2020 年 7 月)
{ "name": "00_test","version": "0.1.0","private": true,"dependencies": { "@testing-library/jest-dom": "^4.2.4","@testing-library/react": "^9.3.2","@testing-library/user-event": "^7.1.2","@types/jest": "^24.0.0","@types/node": "^12.0.0","@types/react": "^16.9.0","@types/react-dom": "^16.9.0","react": "^16.13.1","react-dom": "^16.13.1","react-scripts": "3.4.1","typescript": "^3.7.2","web-vitals": "^1.1.0" },"scripts": { "start": "PORT=4000 react-scripts start","build": "react-scripts build","test": "react-scripts test","eject": "react-scripts eject" },"eslintConfig": { "extends": [ "react-app","react-app/jest" ] },"browserslist": { "production": [ ">0.2%","not dead","not op_mini all" ],"development": [ "last 1 chrome version","last 1 firefox version","last 1 safari version" ] } }
tsconfig.json(2020 年 7 月构建)
{ "compilerOptions": { "target": "es5","lib": [ "dom","dom.iterable","esnext" ],"allowJs": true,"skipLibCheck": true,"esModuleInterop": true,"allowSyntheticDefaultImports": true,"strict": true,"forceConsistentCasingInFileNames": true,"noFallthroughCasesInSwitch": true,"module": "esnext","moduleResolution": "node","resolveJsonModule": true,"isolatedModules": true,"noEmit": true,"jsx": "react-jsx" },"include": [ "src" ] }
-
我这周创建了一个新的 react-app(仅使用 js),
yarn start
ing 后,各种编辑根本不会触发任何热重载。
奇怪的是,在所有 3 种情况下,编译成功后都不会触发通常的自动弹出新浏览器!
我在谷歌上搜索了很多,但只找到了一个不适用的案例(指定为 webpack 问题)。 React 的 github 页面没有显示类似的问题。
我的环境从 2020 年 7 月到现在的变化:
- 使用了具有复杂网络配置选项的新华硕 wifi 路由器 (AC68U);
- VS-code 升级到 v1.53.1(2021 年 1 月版);
- Windows 10 保持升级;
- 使用 WSL2 代替 WSL1;
- 添加nvm管理nodejs版本
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)