Webpack не найден, развертывается в Heroku

очень новый для Node и развертывание в Heroku. У меня есть базовое приложение React, и я пытаюсь развернуть его на Heroku. Я его нажал, но приложение не работает. Когда я смотрю на журналы, я вижу что-то о sh: 1: webpack: not found (полный журнал здесь)

Я не уверен, что происходит, но верю, что это имеет какое-то отношение к моему пакету .json? Из шаблона стартера я использую его как таковой:

{
    "name": "express-react-redux-starter",
    "version": "1.0.0",
    "description": "Starter for Express, React, Redux, SCSS applications",
    "scripts": {
      "dev": "webpack-dev-server --config ./webpack/webpack-dev.config.js --watch --colors",
      "build": "rm -rf dist && webpack --config ./webpack/webpack-prod.config.js --colors",
      "start": "PORT=8080 node start ./server.js",
      "test": "mocha --compilers js:babel-core/register --require ./test/test_helper.js --recursive ./test",
      "test:watch": "npm run test -- --watch",
      "lint": "eslint src test webpack"
    },
    "keywords": [
      "ExpressJS",
      "ReactJS",
      "Redux",
      "React hot loader",
      "React Router",
      "SCSS",
      "Webpack Devevelopment configuration",
      "Webpack Production configuration",
      "Airbnb Eslint",
      "pm2",
      "mocha",
      "chai"
    ],
    "repository": {
      "type": "git",
      "url": "git+https://github.com/DimitriMikadze/express-react-redux-starter"
    },
    "author": "Dimitri Mikadze",
    "license": "MIT",
    "devDependencies": {
      "autoprefixer": "^6.4.0",
      "autoprefixer-loader": "^3.2.0",
      "babel-core": "^6.8.0",
      "babel-loader": "^6.2.4",
      "babel-preset-es2015": "^6.6.0",
      "babel-preset-react": "^6.5.0",
      "babel-preset-stage-1": "^6.5.0",
      "chai": "^3.5.0",
      "chai-jquery": "^2.0.0",
      "css-loader": "^0.23.1",
      "eslint": "^2.10.2",
      "eslint-config-airbnb": "^9.0.1",
      "eslint-plugin-import": "^1.8.0",
      "eslint-plugin-jsx-a11y": "^1.2.0",
      "eslint-plugin-react": "^5.1.1",
      "extract-text-webpack-plugin": "^1.0.1",
      "html-webpack-plugin": "^2.16.1",
      "jquery": "^2.2.3",
      "jsdom": "^9.0.0",
      "mocha": "^2.4.5",
      "node-sass": "^3.7.0",
      "react-addons-test-utils": "^15.0.2",
      "react-hot-loader": "^1.3.0",
      "sass-loader": "^3.2.0",
      "style-loader": "^0.13.1",
      "url-loader": "^0.5.7",
      "webpack-dev-server": "^1.14.1"
    },
    "dependencies": {
      "classnames": "^2.2.5",
      "express": "^4.13.4",
      "lodash": "^4.15.0",
      "react": "^15.0.2",
      "react-dom": "^15.0.2",
      "react-redux": "^4.4.5",
      "react-router": "^2.4.0",
      "redux": "^3.5.2",
      "webpack": "^1.13.0"
    }
}

Что я делаю неправильно, чтобы установить это? Отлично работает на моем локальном хосте. Но не могу понять, как это сделать для меня в жизни. Большое спасибо!

Ответ 1

Хорошо - это связано с devDependencies vs. Dependencies в package.json Кроме того, установив конфигурацию Heroku на NPM_CONFIG_PRODUCTION: false, я смог решить эту проблему. спасибо internet!

Ответ 2

Как уже говорили другие, Heroku запускает узел как production NODE_ENV=production, что означает, что ваши devDependencies не устанавливаются. В Heroku предусмотрены специфичные для узла хуки сборки. Я использую heroku-prebuild для запуска npm install --dev, который устанавливает все зависимости и devDependencies.

"scripts": {
  ...,
  "heroku-prebuild": "npm install --dev",
  ...
},

Вероятно, следует избегать запуска вашего приложения НЕ в производственном режиме. Часто разработчики имеют специальный код "dev mode", который будет отфильтрован при работе в рабочей среде. Кроме того, если вы занимаетесь сборкой веб-пакетов, вы определенно хотите работать в производственном режиме, чтобы воспользоваться преимуществами минификации, углирования и т.д.

Здесь подробности от Heroku.

Иногда разработчикам нужно что-то более ориентированное на производство, чем хуки preinstall и postinstall в package.json. Например, некоторые приложения должны установить дополнительную аутентификацию перед установкой зависимостей. Некоторым нужно создавать активы, но не в среде разработки. Дополнительные примеры можно найти в обсуждении на GitHub.

Разработчики Node.js теперь могут использовать хуки heroku-prebuild и heroku-postbuild, чтобы адаптировать процесс сборки к своим приложениям.

https://devcenter.heroku.com/changelog-items/844

Ответ 3

Это происходит потому, что герою по умолчанию не устанавливает dev Dependencies of package.json, нам нужно exculsively сказать heroku (npm) для установки наших зависимостей dev (webpack находится в dev), поэтому запуск этой команды должен решить "не найден вопрос"

npm install --dev

Ответ 4

Что вызывает это devDependencies не установлены. Вы можете преодолеть это, введя следующую команду в корневой каталог вашего проекта:

heroku config:set NPM_CONFIG_PRODUCTION=false

Затем при следующем развертывании приложения ваша проблема должна быть решена.

Ответ 5

Это поведение изменилось 01.03.2018: https://devcenter.heroku.com/changelog-items/1376

Он установит devDependencies но также devDependencies их как часть развертывания. Обрезку можно пропустить через heroku config:set NPM_CONFIG_PRODUCTION=false. Это все еще оставляет NODE_ENV установленным для production.

Ответ 6

Я неправильно понял проблему, поэтому ее для пользователей пряжи:

"heroku-prebuild": "yarn install --production=false"

Проблема не в сокращении, которое происходит впоследствии в соответствии с документацией (по крайней мере, для npm), а в интерпретации NODE_ENV и только установке производственных зависимостей даже на этапе предварительной сборки.

Чтобы заставить пряжу "контролировать" переменную env, вы должны установить флаг --production=false. см. https://yarnpkg.com/lang/en/docs/cli/install/