我的反应开发服务器太慢了,而且有很多问题。
请看我的配置。
包.json
{
"version": "1.0.2",
"private": true,
"dependencies": {
"@date-io/dayjs": "^1.3.13",
"@date-io/moment": "^1.3.13",
"@fortawesome/fontawesome-svg-core": "^1.2.35",
"@fortawesome/free-solid-svg-icons": "^5.15.3",
"@fortawesome/react-fontawesome": "^0.1.14",
"@grapecity/wijmo": "^5.20203.766",
"@grapecity/wijmo.all": "^5.20203.766",
"@grapecity/wijmo.react.all": "^5.20203.766",
"@material-ui/core": "^4.11.3",
"@material-ui/data-grid": "^4.0.0-alpha.19",
"@material-ui/icons": "^4.11.2",
"@material-ui/lab": "^4.0.0-alpha.57",
"@material-ui/pickers": "^3.2.10",
"@pdftron/pdfjs-express": "^7.3.8",
"@pdftron/webviewer": "^8.0.0",
"@popperjs/core": "^2.6.0",
"@progress/kendo-licensing": "1.1.4",
"@progress/kendo-react-animation": "4.6.0",
"@progress/kendo-react-intl": "4.6.0",
"@progress/kendo-react-treeview": "4.6.0",
"@progress/kendo-theme-default": "4.38.1",
"@react-spring/web": "^9.0.0-rc.3",
"@reduxjs/toolkit": "^1.5.0",
"@syncfusion/ej2": "^19.2.56",
"@syncfusion/ej2-base": "^19.2.55",
"@syncfusion/ej2-pdfviewer": "^19.2.56",
"@syncfusion/ej2-react-base": "^19.2.55",
"@syncfusion/ej2-react-pdfviewer": "^19.2.56",
"@testing-library/user-event": "^12.1.10",
"@types/jest": "^26.0.15",
"@types/jquery": "^3.5.5",
"@types/node": "^12.0.0",
"@types/react-date-range": "^1.1.4",
"@types/react-dom": "17.0.1",
"@welldone-software/why-did-you-render": "^6.0.5",
"auth0-lock": "^11.28.0",
"autoprefixer": "^10.2.4",
"autosuggest-highlight": "^3.1.1",
"axios": "^0.21.1",
"chart.js": "^2.9.4",
"chartjs-plugin-datalabels": "^0.7.0",
"clsx": "^1.1.1",
"common-module": "0.0.28",
"common_module": "^1.0.2",
"components": "^1.0.2",
"cross-fetch": "^3.0.6",
"date-fns": "^2.0.0-beta.5",
"digital-digit": "^1.2.0",
"firebase": "^8.2.6",
"formsy-react": "^2.2.3",
"fuse": "^1.0.2",
"fuse_app": "^1.0.2",
"google-map-react": "^2.1.9",
"hammerjs": "^2.0.8",
"history-module": "^1.0.2",
"hooks": "^1.0.2",
"hwp.js": "0.0.3",
"hygen": "^6.0.4",
"i18n": "^0.13.2",
"i18next": "^19.8.7",
"ip": "^1.1.5",
"jquery": "^3.6.0",
"jss": "^10.5.1",
"jss-plugin-extend": "^10.5.1",
"jss-rtl": "^0.3.0",
"jwt-decode": "^3.1.2",
"lodash-module": "^1.0.2",
"material-ui": "^0.20.2",
"material-ui-popup-state": "^1.7.1",
"mobile-detect": "^1.4.4",
"moment": "^2.29.1",
"moment-locales-webpack-plugin": "^1.2.0",
"moment-range": "^4.0.2",
"moment-timezone": "^0.5.33",
"notistack": "^1.0.3",
"perfect-scrollbar": "^1.5.0",
"popper.js": "^1.16.1",
"postcss": "^8.2.5",
"prismjs": "^1.23.0",
"raw-loader": "^4.0.2",
"react": "17.0.1",
"react-autosuggest": "^10.1.0",
"react-beautiful-dnd": "^13.0.0",
"react-big-calendar": "^0.31.0",
"react-chartjs-2": "^2.11.1",
"react-circular-progressbar": "^2.0.3",
"react-d3-speedometer": "^1.0.1",
"react-date-range": "^1.1.3",
"react-dom": "17.0.1",
"react-draggable": "^4.4.3",
"react-dropzone": "^11.3.0",
"react-frame-component": "^4.1.3",
"react-i18next": "^11.8.6",
"react-masonry-css": "^1.0.14",
"react-number-format": "^4.4.4",
"react-pdf-highlighter": "^4.0.0",
"react-popper": "^2.2.4",
"react-redux": "^7.2.2",
"react-router-config": "^5.1.1",
"react-router-dom": "^5.2.0",
"react-scripts": "4.0.1",
"react-select": "^4.1.0",
"react-swipeable": "^6.0.1",
"reactstrap": "^8.9.0",
"redux": "^4.0.5",
"redux-persist": "^6.0.0",
"redux-thunk": "^2.3.0",
"shortcuts": "^1.6.2",
"styled-components": "^5.2.1",
"tailwindcss-dir": "^4.0.0",
"typescript": "^4.0.3",
"use-async-effect": "^2.2.3",
"utils_js": "^1.0.2",
"utils_ts": "^1.0.2",
"velocity-animate": "^1.5.2",
"web-vitals": "^0.2.4"
},
"scripts": {
"start": "npx kendo-ui-license activate && yarn run tailwind && export PORT=5502 && NODE_ENV=development DISABLE_ESLINT_PLUGIN=true GENERATE_SOURCEMAP=false react-app-rewired --max_old_space_size=8128 start"
},
"eslintConfig": {
"ignorePatterns": [
"src/*",
"!src/test.js"
],
"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"
]
},
"devDependencies": {
"@babel/plugin-proposal-optional-chaining": "^7.12.7",
"@date-io/date-fns": "^1.3.13",
"@types/antd": "^1.0.0",
"@types/i18n": "^0.12.0",
"@types/ip": "^1.1.0",
"@types/material-ui": "^0.21.8",
"@types/react": "^16.14.2",
"@types/react-dropzone": "^5.1.0",
"@types/react-redux": "^7.1.16",
"@types/react-router-config": "^5.0.2",
"@types/react-router-dom": "^5.1.7",
"@types/redux": "^3.6.0",
"@types/redux-persist": "^4.3.1",
"@types/redux-thunk": "^2.1.0",
"@types/styled-components": "^5.1.7",
"babel-plugin-import": "^1.13.3",
"customize-cra": "^1.0.0",
"eslint": "^7.11.0",
"purgecss": "1.4.2",
"react-app-rewired": "^2.1.8",
"react-spring": "^8.0.27",
"react-swipeable-views": "^0.13.9",
"react-table": "^7.6.3",
"react-text-mask": "^5.4.3",
"react-virtualized": "^9.22.3",
"react-window": "^1.8.6",
"tailwind": "^4.0.0",
"tailwindcss": "^2.0.3",
"velocity-react": "^1.4.3"
},
"peerDependencies": {
"react": ">=16.8.0",
"react-dom": ">=16.8.0"
}
}
覆盖.js
const { useBabelRc, override, addWebpackAlias, addWebpackPlugin } = require("customize-cra");
const MomentLocalesPlugin = require('moment-locales-webpack-plugin');
// const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
const addPlugin = config =>{
config.plugins.push(new MomentLocalesPlugin());
return config;
}
const path = require("path");
module.exports = override(
addPlugin,
useBabelRc(),
addWebpackAlias({
['@fuse_app'] : path.resolve(__dirname, "src/@fuse_app"),
['@fuse'] : path.resolve(__dirname, "src/@fuse"),
['@lodash'] : path.resolve(__dirname, "src/@lodash"),
['@history'] : path.resolve(__dirname, "src/@history"),
}),
);
// addWebpackPlugin(new BundleAnalyzerPlugin()),
.babelrc
{
"plugins": [
[
"@babel/plugin-proposal-optional-chaining"
],
["import", { "libraryName": "antd", "libraryDirectory": "lib"}, "antd"],
["import", { "libraryName": "antd-mobile", "libraryDirectory": "lib"}, "antd-mobile"]
]
}
并且我的过程屏幕截图 在此处输入图像描述
当我运行“npm start”时,需要超过 1 分钟。当我编辑我的代码并保存时,它需要 10 多秒。我不知道为什么应用程序这么长,cpu 使用量这么大。请任何人帮助我。
- 我的 repo 使用 lerna 运行(repo 中存在许多打字稿.. sry)
请看我的设置。谢谢你。