Невозможно использовать маршруты реагирования на Heroku - PullRequest
0 голосов
/ 06 апреля 2020

Я работаю над школьным проектом по развертыванию React + SpringBoot + AWS RDS для Heroku. Проект строится и работает очень хорошо локально. При развертывании на Heroku: процесс сборки завершается успешно. Когда я go на URL моего проекта, домашняя страница загружается успешно. Тем не менее, это единственная страница, к которой я могу получить доступ, поскольку все другие маршруты, кроме "/", выдают ошибку 404 страницы не найдена.

Что я пробовал: я провел онлайн-исследование и добавил следующие данные c . json файл в root моего каталога:

{
 "root": "build/",
 "error_page": "error.html",
 "clean_urls": false,
 "https_only": true,
 "routes": {
   "/**": "index.html"
  }
}

Я попытался переместить эту папку на один уровень каталога в свою папку веб-интерфейса - не повезло. Файл My React App. js выглядит следующим образом:

class App extends Component {
render() {
    return (
        <Router>
          <Switch>
            <Route exact path="/" component={LandingPage} />
              <Route exact path="/add" component={AddEmployee} />
              <Route exact path="/view" component={Table} />
              <Route exact path="/search" component={Search} />
              <Route exact path="/searchres" component={SearchResults} />
              <Route exact path="/delete" component={Delete} />
              <Route exact path="/update" component={UpdateEmployee} />
          </Switch>
        </Router>
    );
  }
}

export default App;

Мой файл webpack.config. js выглядит следующим образом:

var webpack = require('webpack'); // eslint-disable-line

var env = process.env.NODE_ENV;   // eslint-disable-line
var filename = 'ethjs-util';      // eslint-disable-line
var library = 'ethUtil';          // eslint-disable-line
var config = {                    // eslint-disable-line
 module: {
 loaders: [
   {
    test: /\.js$/,
    loaders: ['babel-loader'],
    exclude: /node_modules/,
  },
  {
    test: /\.json$/,
    loader: 'json',
  },
],
},
devtool: 'cheap-module-source-map',
output: {
  path: 'dist',
  filename: filename + '.js',       // eslint-disable-line
  library: library,                 // eslint-disable-line
  libraryTarget: 'umd',
  umdNamedDefine: true,
},
plugins: [
  new webpack.BannerPlugin({ banner: ' /* eslint-disable */ ', raw:   
    true, entryOnly: true }),
  new webpack.optimize.OccurrenceOrderPlugin(),
  new webpack.DefinePlugin({
    'process.env.NODE_ENV': JSON.stringify(env),
  }),
 ],
};

if (env === 'production') {
  config.output.filename = filename + '.min.js'; // eslint-disable- 
   line
  config.plugins
  .push(new webpack.optimize.UglifyJsPlugin({
    compressor: {
      pure_getters: true,
      unsafe: true,
      unsafe_comps: true,
      warnings: false,
      screw_ie8: false,
    },
    mangle: {
      screw_ie8: false,
    },
    output: {
      screw_ie8: false,
    },
  }));
  config.plugins.push(new webpack.optimize.DedupePlugin());
}

module.exports = config;

Я понимаю, что Heroku имеет указанные c конфигурации для маршрутов React, и я попытался следовать рекомендациям с файлом stati c. json, но все равно получал ошибку 404. Будем рады предоставить любую дополнительную информацию. Заранее спасибо.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...