Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/reactjs/23.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Reactjs 在heroku上部署React Redux网页包_Reactjs_Heroku_Deployment_Webpack_Package.json - Fatal编程技术网

Reactjs 在heroku上部署React Redux网页包

Reactjs 在heroku上部署React Redux网页包,reactjs,heroku,deployment,webpack,package.json,Reactjs,Heroku,Deployment,Webpack,Package.json,嗯,我有一个大问题,我有一个前端只响应发送请求到RubyonRails api,我们使用redux,babel和webpack。我的问题是,我不能让这个项目在Heroku上运行 这是来自heroku的503响应错误 Package.json: { "name": "real-networking-ui", "version": "1.0.0", "description": "Real Netoworking UI", "main": "index.js", "scripts

嗯,我有一个大问题,我有一个前端只响应发送请求到RubyonRails api,我们使用redux,babel和webpack。我的问题是,我不能让这个项目在Heroku上运行

这是来自heroku的503响应错误

Package.json:

{
  "name": "real-networking-ui",
  "version": "1.0.0",
  "description": "Real Netoworking UI",
  "main": "index.js",
  "scripts": {
    "start": "node -r babel-register ./node_modules/webpack-dev-server/bin/webpack-dev-server --config ./webpack.config.dev.js --progress --profile --colors",
    "build": "node -r babel-register ./node_modules/webpack/bin/webpack --config ./webpack.config.prod --progress --profile --colors",
    "lint": "eslint app test *.js"
  },
  "engines": {
    "node": "6.6.0"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "autoprefixer": "^6.3.6",
    "babel-core": "^6.10.4",
    "babel-eslint": "^6.1.0",
    "babel-loader": "^6.2.4",
    "babel-plugin-dev-expression": "^0.2.1",
    "babel-plugin-lodash": "^3.2.11",
    "babel-plugin-react-transform": "^2.0.2",
    "babel-plugin-transform-remove-console": "^6.8.0",
    "babel-plugin-transform-remove-debugger": "^6.8.0",
    "babel-preset-es2015": "^6.9.0",
    "babel-preset-react": "^6.11.1",
    "babel-preset-react-hmre": "^1.1.1",
    "babel-preset-react-optimize": "^1.0.1",
    "babel-preset-stage-0": "^6.5.0",
    "babel-register": "^6.9.0",
    "classnames": "^2.2.5",
    "css-loader": "^0.23.1",
    "eslint": "^2.13.1",
    "eslint-config-airbnb": "^9.0.1",
    "eslint-import-resolver-webpack": "^0.3.2",
    "eslint-loader": "^1.6.1",
    "eslint-plugin-import": "^1.10.0",
    "eslint-plugin-jsx-a11y": "^1.5.3",
    "eslint-plugin-react": "^5.2.2",
    "extract-text-webpack-plugin": "^1.0.1",
    "html-webpack-plugin": "^2.21.0",
    "json-loader": "^0.5.4",
    "postcss-css-variables": "^0.5.1",
    "postcss-loader": "^0.9.1",
    "postcss-mixins": "^5.0.0",
    "postcss-nested": "^1.0.0",
    "postcss-partial-import": "^1.3.0",
    "react-transform-hmr": "^1.0.4",
    "style-loader": "^0.13.1",
    "svg-react": "^1.0.9",
    "webpack": "^1.13.1",
    "webpack-dev-server": "^1.14.1"
  },
  "dependencies": {
    "axios": "^0.15.3",
    "core-js": "^2.4.1",
    "css-loader": "^0.23.1",
    "lodash": "^4.17.2",
    "moment": "^2.17.1",
    "node-sass": "^3.13.0",
    "react": "^15.1.0",
    "react-dom": "^15.1.0",
    "react-hot-loader": "^3.0.0-beta.6",
    "react-maskedinput": "^3.3.1",
    "react-modal": "^1.6.4",
    "react-redux": "^4.4.5",
    "react-router": "^3.0.0",
    "react-router-redux": "^4.0.5",
    "react-select": "^1.0.0-rc.2",
    "react-select-box": "^3.0.1",
    "redux": "^3.5.2",
    "redux-thunk": "^2.1.0",
    "sass-loader": "^4.0.2",
    "style-loader": "^0.13.1",
    "svg-react": "^1.0.9",
    "validator": "^6.2.0",
    "whatwg-fetch": "^2.0.1"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "babel": {
    "presets": [
      "react-app"
    ]
  }
}
webpack.config.base:

    import ExtractTextPlugin from 'extract-text-webpack-plugin';
import HtmlWebpackPlugin from 'html-webpack-plugin';

export default {
  entry: './app/app.js',
  output: {
    path: './app/App/dist',
    filename: '/bundle.js',
  },
  module: {
    loaders: [
      {
        test: /\.json$/,
        loader: 'json',
      },
      {
        test: /\.scss$/,
        loader: ExtractTextPlugin.extract('css!sass'),

      },
      {
        test: /\.css$/,
        loader: ExtractTextPlugin.extract('css!sass'),
      },
      {
        test: /\.jsx?$/,
        exclude: /node_modules/,
        loader: 'babel-loader',
      },
      {
        test: /\.svg$/,
        loader: 'babel?presets[]=es2015,presets[]=react!svg-react',
      },
    ],
  },
  plugins: [
    new HtmlWebpackPlugin({
      template: './app/App/index.html',
    }),
    new ExtractTextPlugin('/app/App/css/default.css', {
      allChunks: true,
    }),
  ],
};
webpack.config.dev:

    import webpack from 'webpack';
import baseConfig from './webpack.config.base';

const config = {
  ...baseConfig,
  debug: true,
  devtool: 'cheap-module-eval-source-map',
  plugins: [
    ...baseConfig.plugins,
    new webpack.HotModuleReplacementPlugin(),
  ],
  devServer: {
    colors: true,
    historyApiFallback: true,
    inline: true,
    hot: true,
  },
};
export default config;
webpack.config.prod.js:

    import webpack from 'webpack';
import baseConfig from './webpack.config.base';

const config = {
  ...baseConfig,
  plugins: [
    ...baseConfig.plugins,
    new webpack.DefinePlugin({
      'process.env': {
        NODE_ENV: JSON.stringify('production'),
      },
    }),
    new webpack.optimize.OccurrenceOrderPlugin(),
    new webpack.optimize.UglifyJsPlugin({
      compressor: {
        screw_ie8: true,
        warnings: false,
      },
    }),
  ],
};
export default config;
程序文件:

web: npm start
如果你需要更多的信息,告诉我,我编辑它


感谢您的帮助。

heroku的默认配置是将依赖项缓存在
节点\u模块中,并将生产环境设置为true

缓存
node_模块
可防止安装其他模块。 生产环境阻止安装
package.json
中的
devdependency

另外,webpack dev server在Heroku中不起作用,因此最好创建一个小型web服务器(我个人喜欢Express server),为
dist
文件夹提供服务,然后部署应用程序


此外,如果您仍然面临问题,请尝试运行heroku logs--tail
并将日志粘贴到此处。

我的看法是,应该在依赖项下重新安装依赖项。在类似的情况下,我尝试在Heroku上部署时出现了错误屏幕。devdependency将被忽略,并且每当您的代码要求它们时,就会发出警报

我想我也有同样的问题。你找到解决办法了吗?没有,我没有找到