web-dev-qa-db-fra.com

Webpack introuvable, déploiement sur Heroku

très nouveau à Node et déploiement à Heroku. J'ai une application de base React installée et je tente de me déployer à Heroku. Je l'ai poussé, mais l'application échoue. Quand je regarde les journaux, je vois quelque chose à propos de sh: 1: webpack: not found (journal complet ici )

Je ne suis pas vraiment certain de ce qui se passe, mais je crois que cela a quelque chose à voir avec mon package.json? Le gabarit de démarrage que j'utilise est le suivant:

{
    "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"
    }
}

Qu'est-ce que je fais mal pour le faire déployer? Fonctionne très bien sur mon localhost. Mais je ne peux pas comprendre comment mettre cela dans le monde pour la vie de moi. Merci beaucoup!

node.jsexpressreactjsheroku
10
vesperae

Ok - cela a à voir avec devDependencies vs Dependencies dans package.json De plus, en réglant la configuration Heroku sur NPM_CONFIG_PRODUCTION: false, j'ai pu résoudre ce problème. Thx internet!

18
vesperae

Cela se produit parce que heroku par défaut n’installe pas les dépendances dev de package.json, nous devons donc demander à Heroku (npm) d’installer nos dépendances dev (le pack Web est en développement). problème trouvé "

.

npm install --dev
8
Deepak Sharma

Comme d'autres l'ont dit, Heroku exécute le noeud en tant que NODE_ENV=production de production, ce qui signifie que vos devDependencies ne sont pas installés. Heroku fournit cependant des crochets de construction spécifiques à un nœud. J'utilise heroku-prebuild pour exécuter npm install --dev, qui installe toutes les dépendances et devDependencies.

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

L'exécution de votre application PAS en mode production devrait probablement être évitée. Les développeurs ont souvent un code spécifique au "mode dev" qui sera filtré lors de son exécution en production. De plus, si vous créez un pack Web, vous voulez absolument être en mode de production pour tirer parti de la minimisation, de l'orgueil, etc.

Voici les détails de Heroku.

Parfois, les développeurs ont besoin de quelque chose de plus orienté production que le les points d'ancrage préinstallés et postinstallés dans package.json. Par exemple, certains les applications doivent configurer une authentification supplémentaire avant d'installer dépendances. Certains ont besoin de constituer des actifs, mais pas dans un développement environnement. Vous trouverez d’autres exemples dans la discussion sur GitHub.

Les développeurs de Node.js peuvent maintenant utiliser heroku-prebuild et heroku-postbuild crochets pour adapter le processus de construction à leurs applications.

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

8
SomethingOn

Ce qui cause ceci est devDependencies ne sont pas installés. Vous surmontez ce problème en tapant la commande suivante dans le répertoire racine de votre projet:

heroku config:set NPM_CONFIG_PRODUCTION=false

Ensuite, la prochaine fois que vous déploierez votre application, votre problème devrait être résolu.

1
Alex P

Ce comportement a changé le 01.03.2018: https://devcenter.heroku.com/changelog-items/1376

Il installera devDependencies mais les supprimera également dans le cadre du déploiement. L'élagage peut être ignoré via heroku config:set NPM_CONFIG_PRODUCTION=false. Cela laisse toujours NODE_ENV défini sur production.

0
thisismydesign