Занимаюсь изучением React, сделал сборку в webpack. Когда запускаю devserver все отлично работает, но когда генерирую файл bundle.js и запускаю на стороннем сервере, то файл bundle.js не запускается. Вернее подгружается (если написать в нем console.log, то в консоле надпись выдает), но приложение не монтируется к mount-point.
Код webpack.config.js:
var webpack = require('webpack');
var autoprefixer = require('autoprefixer');
module.exports = {
entry: "./src/main.js",
output: {
path: __dirname + '/public/build/',
publicPath: "build/",
filename: "bundle.js"
},
module: {
rules: [
{
test: /\.js$/,
use: [{
loader: 'babel-loader',
query: {
presets: ['es2015', 'stage-0', 'react']
}
}],
exclude: [/node_modules/, /public/],
},
{
test: /\.jsx$/,
use: [{
loader: 'babel-loader',
query: {
presets: ['es2015', 'stage-0', 'react']
}
}],
exclude: [/node_modules/, /public/]
},
{
test: /\.css$/,
use: [
{
loader: 'style-loader'
},
{
loader: 'css-loader',
options: {
sourceMap: true
}
},
{
loader: 'postcss-loader',
options: {
plugins: [
autoprefixer({
browsers:['ie >= 8', 'last 4 version']
})
],
sourceMap: true
}
}
],
exclude: [/node_modules/, /public/]
},
{
test: /\.scss$/,
use: [
{
loader: 'style-loader'
},
{
loader: 'css-loader',
options: {
sourceMap: true
}
},
{
loader: 'postcss-loader',
options: {
plugins: [
autoprefixer({
browsers:['ie >= 8', 'last 4 version']
})
],
sourceMap: true
}
},
{
loader: 'sass-loader'
}
],
exclude: [/node_modules/, /public/]
},
{
test: /\.gif$/,
loader: "url-loader?limit=10000&mimetype=image/gif"
},
{
test: /\.jpg$/,
loader: "url-loader?limit=10000&mimetype=image/jpg"
},
{
test: /\.png$/,
loader: "url-loader?limit=10000&mimetype=image/png"
},
{
test: /\.svg$/,
loader: "url-loader?limit=10000&mimetype=image/svg"
}
]
},
mode: 'none'
}
Код package.json:
{
"name": "ReactJS",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"devserver": "webpack-dev-server --debug --hot --devtool eval-source-map --output-pathinfo --watch --colors --inline --content-base public --port 8090 --host localhost",
"build": "webpack -p"
},
"author": "Stanislav Bykov",
"license": "ISC",
"dependencies": {
"@material-ui/core": "^3.4.0",
"@material-ui/icons": "^3.0.1",
"classnames": "^2.2.6",
"events": "^3.0.0",
"flux": "^3.1.3",
"jquery": "^3.3.1",
"keymirror": "^0.1.1",
"moment": "^2.23.0",
"react": "^16.5.2",
"react-dom": "^16.5.2",
"react-router": "^4.3.1",
"react-router-dom": "^4.3.1"
},
"devDependencies": {
"autoprefixer": "^9.1.5",
"babel-core": "^6.26.3",
"babel-loader": "^7.0.0",
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",
"babel-preset-stage-0": "^6.24.1",
"css-loader": "^1.0.0",
"file-loader": "^2.0.0",
"json-loader": "^0.5.7",
"node-sass": "^4.9.3",
"postcss-loader": "^3.0.0",
"prop-types": "^15.6.2",
"react-hot-loader": "^4.3.8",
"sass-loader": "^7.1.0",
"style-loader": "^0.23.0",
"url-loader": "^1.1.1",
"webpack": "^4.19.1",
"webpack-cli": "^3.1.0",
"webpack-dev-server": "^3.1.8"
}
}
Простой
Простой
