从 react-create-app 迁移到通常的 react 应用程序答案

【问题标题】：Migrating from react-create-app to usual react application从 react-create-app 迁移到通常的 react 应用程序
【发布时间】：2018-08-23 15:24:35
【问题描述】：

最近我开始研究一个由另一个程序员基于 react-create-app 编写的商业项目。由于项目已经够大了，而且还没有停止开发，所以使用 react-create-app 越来越不方便了，因为我希望自己能够完全配置好 webpack、node.js 等包。

我正在寻找机会尽快将项目从 react-create-app 迁移到表单，就好像项目最初是在没有它的情况下编写的一样。

在npm run eject 之后处理代码在我看来过于复杂。

我正在尝试至少找到一些关于此问题的说明或指南，但尚未找到。

这是 package.json 依赖项：

{
    "dependencies": {
    "classnames": "^2.2.5",
    "google-maps-react": "^2.0.2",
    "history": "^4.7.2",
    "husky": "^0.14.3",
    "lint-staged": "^7.2.0",
    "lodash.debounce": "^4.0.8",
    "lodash.isequal": "^4.5.0",
    "lodash.throttle": "^4.1.1",
    "moment-timezone": "^0.5.17",
    "prettier": "^1.12.1",
    "prop-types": "^15.6.1",
    "react": "^16.3.2",
    "react-collapse": "^4.0.3",
    "react-copy-to-clipboard": "^5.0.1",
    "react-dom": "^16.3.2",
    "react-facebook-login": "^3.7.2",
    "react-google-login": "^2.11.3",
    "react-input-mask": "^1.2.2",
    "react-motion": "^0.5.2",
    "react-redux": "^5.0.7",
    "react-router": "^4.2.0",
    "react-router-dom": "^4.2.2",
    "react-router-redux": "^5.0.0-alpha.9",
    "react-scripts": "1.1.4",
    "react-scrollchor": "^4.2.1",
    "react-slick": "^0.14.11",
    "react-stripe-elements": "^1.6.0",
    "redux": "^4.0.0",
    "redux-logger": "^3.0.6",
    "redux-thunk": "^2.2.0",
    "validator": "^8.2.0"
  },

  "devDependencies": {
    "eslint": "^5.3.0",
    "eslint-config-airbnb": "^17.0.0",
    "eslint-config-prettier": "^2.9.0",
    "eslint-plugin-import": "^2.13.0",
    "eslint-plugin-jsx-a11y": "^6.1.1",
    "eslint-plugin-prettier": "^2.6.2",
    "eslint-plugin-react": "^7.10.0",
    "react-scrolllock": "^3.0.1",
    "redux-devtools-extension": "^2.13.5",
    "reselect": "^3.0.1",
    "stylelint": "^9.4.0",
    "stylelint-config-standard": "^18.2.0"
  }
}

【问题讨论】：

create-react-app 的目的是隐藏和简化 webpack 的复杂性和其他增强的依赖项（如 babel）
嘿，Darya，您的项目还有哪些其他依赖项，例如react-redux，react-router-dom？在您的问题中包含 package.json 将有助于为您提供更好的建议。
嗨，罗伊，感谢您的反馈！我在最初的问题中添加了依赖项。
你想做的事是个坏主意。您已经说过弹出后很复杂。你认为几个月后会发生什么？你的配置对于下一个工程师来说太复杂了

标签： reactjs react-create-app

【解决方案1】：

我会说这取决于你想做什么。我有同样的问题。我弹出了我的本地副本，发现我遇到了很多问题。我的解决方案是在现有的 CRA 项目广告中执行以下操作：

更新到最新的 react 和 react-dom ，运行 'yarn react@next react-dom@next'
您现在应该拥有最新的 React 版本 - 因此您可以使用 React.lazy/React.Suspense 进行代码拆分、使用钩子等等。
如果您在使用导入语法时遇到错误问题，您需要使用 babel-plugin-syntax-dynamic-import 插件。将“babel”字段放在你的包 json 中。

我希望这是一些帮助。还有https://github.com/timarney/react-app-rewired之类的库，不过我没用过。

【讨论】：