Приложение React с Webpack, babel, развернутый поверх netlify, показывающий, что страница не найдена, хотя загруженная сборка работает нормально в локальном режиме.
Я развернул с помощью панели перетаскивания netlify путем перетаскивания папки приложения реакции. Не с github.
Топи сообщества Netlify c ссылка на то же -
https://community.netlify.com/t/page-not-found-error-downloaded-build-working-in-local-but-not-on-netlify-site/20094
Здесь нет сайта - https://gracious-roentgen-c5c8be.netlify.app/
Статус сборки - Опубликованное развертывание Производство . Сегодня в 10:38. Загрузка готова
Журнал развертывания - 10:38:22: начало постобработки 10:38:22: постобработка - HTML 10:38: 23 AM: Пост-обработка - правила перенаправления 10:38:23: Пост-обработка - правила заголовка 10:38:23: Пост-обработка завершена 10:38:23: Сайт работает
Вот my webpack.config. js:
const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
entry: ['./src/index.js', '@babel/polyfill'],
module: {
rules: [
{
test: /\.(js|jsx)$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader',
options: {
presets: ['@babel/preset-react', '@babel/preset-env'],
},
},
},
{
test: /\.css$/i,
exclude: /node_modules/,
use: [
'style-loader',
{
loader: 'css-loader',
options: {
modules: true,
},
},
],
},
{
test: /\.(jpe?g|gif|png|svg)$/i,
use: [
{
loader: 'url-loader',
options: {
limit: 10000,
},
},
],
},
{
test: /\.(gif|png|jpe?g)$/,
use: [
{
loader: 'file-loader',
options: {
name: '[name].[ext]',
outputPath: 'assets/images/',
},
},
],
},
// {
// loader: 'babel-loader',
// options: {
// presets: ['@babel/react', '@babel/env', '@babel/preset-env'],
// },
// },
],
// loaders: [{ test: /\.jsx?$/, loader: 'babel' }],
},
devServer: {
host: '192.168.1.10', //your ip address,
// host: '0.0.0.0', //your ip address,
historyApiFallback: true,
contentBase: '././src',
port: 8080,
disableHostCheck: true,
},
resolve: {
extensions: ['*', '.js', '.jsx'],
},
output: {
path: path.join(__dirname, '/dist'),
filename: 'bundle.js',
publicPath: '/',
},
plugins: [
new webpack.HotModuleReplacementPlugin(),
new HtmlWebpackPlugin({
template: path.resolve('./dist/index.html'),
}),
],
devServer: {
// contentBase: './dist',
contentBase: './build',
hot: true,
},
};
Пакет. json:
{
"name": "dljalpha",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"start": "webpack-dev-server --mode development --open --hot --host 0.0.0.0",
"test": "jest",
"build": "webpack --mode production"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"@babel/core": "^7.8.7",
"@babel/polyfill": "^7.10.1",
"@babel/preset-env": "^7.10.2",
"@babel/preset-react": "^7.10.4",
"axios-mock-adapter": "^1.18.1",
"babel-eslint": "^10.1.0",
"babel-loader": "^8.0.6",
"css-loader": "^3.5.3",
"enzyme": "^3.11.0",
"enzyme-adapter-react-16": "^1.15.2",
"eslint": "^6.8.0",
"eslint-config-airbnb": "^18.1.0",
"eslint-config-prettier": "^6.11.0",
"eslint-loader": "^4.0.2",
"eslint-plugin-import": "^2.20.1",
"eslint-plugin-jsx-a11y": "^6.2.3",
"eslint-plugin-prettier": "^3.1.3",
"eslint-plugin-react": "^7.19.0",
"eslint-plugin-react-hooks": "^2.5.0",
"file-loader": "^6.0.0",
"identity-obj-proxy": "^3.0.0",
"jest": "^26.0.1",
"prettier": "^2.0.5",
"react-hot-loader": "^4.12.19",
"redux-mock-store": "^1.5.4",
"style-loader": "^1.2.1",
"url-loader": "^4.1.0",
"webpack": "^4.42.0",
"webpack-cli": "^3.3.11",
"webpack-dev-server": "^3.10.3"
},
"dependencies": {
"@material-ui/core": "^4.10.2",
"@material-ui/icons": "^4.9.1",
"@material-ui/lab": "^4.0.0-alpha.56",
"axios": "^0.19.2",
"core-js": "^3.6.5",
"html-webpack-plugin": "^4.3.0",
"husky": "^4.2.5",
"prop-types": "^15.7.2",
"react": "^16.13.0",
"react-dom": "^16.13.0",
"react-intl": "^4.6.3",
"react-redux": "^7.2.0",
"react-router": "^5.2.0",
"react-router-dom": "^5.2.0",
"react-share": "^4.2.1",
"react-test-renderer": "^16.13.1",
"recompose": "^0.30.0",
"redux": "^4.0.5",
"redux-saga": "^1.1.3",
"regenerator-runtime": "^0.13.5"
}
}
Пожалуйста, помогите. Спасибо