Разверните приложение response-app-rewired и react-app-rewire-less на Heroku
Я использовал реагировать-приложение-перепрограммировано и реагировать-приложение-без перепрограммирования, чтобы применить Less к моему приложению на основе React. Он отлично работает локально, но когда я развернул его на Heroku, он не удался, и я получил Ошибка приложения и список ошибок в журналах Heroku.
Я предпринял два действия:
1) Я удалил npm и переустановил его глобально, чтобы избежать потенциальных ошибок.
2) Чтобы обе зависимости (react-app-rewired и react-app-rewire-less) работали нормально, я удалил их и снова установил локально с помощью npm install [dependency name] --save, но ошибка приложения не исчезла.
Может кто-нибудь, пожалуйста, скажите мне корень проблемы и предложите решение? Ниже мой package.json.
`{
"name": "portfolio",
"version": "1.0.0",
"engines": {
"node": "8.11.1"
},
"private": true,
"dependencies": {
"react": "^16.4.2",
"react-app-rewire-less": "^2.1.2",
"react-app-rewired": "^1.5.2",
"react-dom": "^16.4.2",
"react-scripts": "1.1.4"
},
"scripts": {
"start": "react-app-rewired start",
"build": "react-app-rewired build",
"test": "react-app-rewired test --env=jsdom",
"eject": "react-app-rewired eject"
},
"devDependencies": {}
}`
Вот мои сообщения об ошибках Heroku:
`2018-08-14T09:39:19.000000+00:00 app[api]: Build succeeded
2018-08-14T09:39:22.097727+00:00 heroku[web.1]: Starting process with command `npm start`
2018-08-14T09:39:24.612289+00:00 app[web.1]:
2018-08-14T09:39:24.612308+00:00 app[web.1]: > [email protected] start /app
2018-08-14T09:39:24.612310+00:00 app[web.1]: > react-app-rewired start
2018-08-14T09:39:24.612312+00:00 app[web.1]:
2018-08-14T09:39:26.199701+00:00 app[web.1]: /app/node_modules/react-app-rewire-less/index.js:28
2018-08-14T09:39:26.199764+00:00 app[web.1]: ...cssRules.loader,
2018-08-14T09:39:26.199766+00:00 app[web.1]: ^
2018-08-14T09:39:26.199768+00:00 app[web.1]:
2018-08-14T09:39:26.199770+00:00 app[web.1]: TypeError: cssRules.loader is not iterable
2018-08-14T09:39:26.199772+00:00 app[web.1]: at /app/node_modules/react-app-rewire-less/index.js:28:23
2018-08-14T09:39:26.199774+00:00 app[web.1]: at Object.override [as webpack] (/app/config-overrides.js:5:12)
2018-08-14T09:39:26.199776+00:00 app[web.1]: at Object.<anonymous> (/app/node_modules/react-app-rewired/scripts/start.js:13:13)
2018-08-14T09:39:26.199778+00:00 app[web.1]: at Module._compile (module.js:652:30)
2018-08-14T09:39:26.199780+00:00 app[web.1]: at Object.Module._extensions..js (module.js:663:10)
2018-08-14T09:39:26.199781+00:00 app[web.1]: at Module.load (module.js:565:32)
2018-08-14T09:39:26.199783+00:00 app[web.1]: at tryModuleLoad (module.js:505:12)
2018-08-14T09:39:26.199784+00:00 app[web.1]: at Function.Module._load (module.js:497:3)
2018-08-14T09:39:26.199786+00:00 app[web.1]: at Function.Module.runMain (module.js:693:10)
2018-08-14T09:39:26.199787+00:00 app[web.1]: at startup (bootstrap_node.js:188:16)
2018-08-14T09:39:26.199789+00:00 app[web.1]: at bootstrap_node.js:609:3
2018-08-14T09:39:26.224092+00:00 app[web.1]: npm ERR! code ELIFECYCLE
2018-08-14T09:39:26.224599+00:00 app[web.1]: npm ERR! errno 1
2018-08-14T09:39:26.226462+00:00 app[web.1]: npm ERR! [email protected] start: `react-app-rewired start`
2018-08-14T09:39:26.226736+00:00 app[web.1]: npm ERR! Exit status 1
2018-08-14T09:39:26.227064+00:00 app[web.1]: npm ERR!
2018-08-14T09:39:26.227388+00:00 app[web.1]: npm ERR! Failed at the [email protected] start script.
2018-08-14T09:39:26.227672+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.`
Ответы 2
Похоже на ту же проблему, о которой здесь говорится: прерывается с NODE_ENV = production.
В комментариях к этой проблеме есть ссылка на обходной путь, который добавляет const lessLoader = cssRules.loader || cssRules.use и меняет местами cssRules.loader на lessLoader в react-app-rewire-less/index.js.
Я бы попытался разветвить репо, применить мои изменения, а затем обновить ваш package.json, чтобы он указывал на вашу вилку, используя URL-адреса GitHub
Просто вам нужно добавить ниже зависимости в dependencies файла package.json.
"babel-plugin-import": "^1.12.2",
"less-loader": "^5.0.0",
"react-app-rewire-less": "^2.1.3",
"react-app-rewired": "^2.1.5"
И разверните свое приложение React на heroku. У меня это сработало. Мне НЕ требовалось добавлять NODE_ENV=production перед react-app-rewired start. Он работает нормально.
Спасибо за ответ! Обходной путь в этой ссылке предлагает изменить несколько строк внутри
react-app-rewire-less/index.js, но этот файл находится в папке node_modules, которая не может быть отправлена в облако и будет обновлена npm. Как я могу применить это решение в своем приложении?