web-dev-qa-db-ja.com

Webpackが見つかりません。Herokuにデプロイしています

NodeおよびHerokuにデプロイするのが非常に新しい。基本的なReactアプリをセットアップし、Herokuにデプロイしようとしている。アプリが失敗しています。ログを見ると、sh: 1: webpack: not found（完全なログ ここ ）

何が起こっているのかは確かではありませんが、package.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"
    }
}

これをデプロイするために間違って何をしていますか？私のローカルホストでうまく動作します。しかし、私の人生のためにこれを世界に持ち込む方法を理解することはできません。どうもありがとう！

node.jsexpressreactjsheroku
14
vesperae

Ok-これは、package.jsonのdevDependenciesとDependenciesに関係しています。また、Herokuの設定をNPM_CONFIG_PRODUCTION: falseこれを解決できました。 Thxインターネット！

21
vesperae

他の人が言ったように、Herokuはノードを実動として実行しますNODE_ENV=productionは、devDependenciesがインストールされないことを意味します。ただし、Herokuはノード固有のビルドフックを提供します。私が使う heroku-prebuild 走る npm install --dev、すべての依存関係とdevDependenciesをインストールします。

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

本番モード以外でアプリを実行することはおそらく避けるべきです。多くの場合、開発者は本番環境で実行するときに除外される「開発モード」固有のコードを持っています。さらに、Webpackビルドで物事を行う場合は、間違いなくプロダクションモードにして、縮小、uいなどを活用したいです。

Herokuの詳細を以下に示します。

開発者は、package.jsonのpreinstallおよびpostinstallフックよりも本番指向の何かを必要とする場合があります。たとえば、一部のアプリでは、依存関係をインストールする前に追加の認証を設定する必要があります。資産を構築する必要がありますが、開発環境では必要ありません。さらなる例は、GitHubの議論で見つけることができます。

Node.js開発者は、heroku-prebuildおよびheroku-postbuildフックを使用して、ビルドプロセスをアプリに合わせて調整できるようになりました。

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

11
SomethingOn

これは、herokuがデフォルトでpackage.jsonのdev Dependenciesをインストールしないために発生し、heroku（npm）にdev依存関係（webpackはdevにある）を排他的にインストールする必要があるため、このコマンドを実行すると「not found issue」が解決されます

。

npm install --dev
9
Deepak Sharma

この原因は、devDependenciesがインストールされていないことです。プロジェクトのルートディレクトリで次のコマンドを入力することで、これを克服できます。

heroku config:set NPM_CONFIG_PRODUCTION=false

その後、アプリを次回デプロイするときに問題が解決するはずです。

3
Purkhalo Alex

私は問題を誤解していたので、彼女は糸のユーザーのために：

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

問題は、docu（少なくともnpmの場合）に従って後で発生するプルーニングではなく、糸がNODE_ENVを解釈し、ビルド前フェーズでもプロダクション依存関係のみをインストールすることです。

ヤーンにenv変数を「監視」させるには、--production=false 国旗。 https://yarnpkg.com/lang/en/docs/cli/install/ を参照してください

0
estani

この動作は2018年3月1日に変更されました： https://devcenter.heroku.com/changelog-items/1376

devDependenciesをインストールしますが、デプロイの一部としてそれらを整理します。プルーニングは、heroku config:set NPM_CONFIG_PRODUCTION=falseを介してスキップできます。 NODE_ENVはproductionに設定されたままです。

0
thisismydesign