Скорей всего там много лишнего, без чего можно обойтись.
Уверены, что на чанки нельзя разбить?
require.ensure?
const cssnanoConf = cssnano({
autoprefixer: {
add: true,
remove: true,
},
discardComments: {
removeAll: true,
},
discardDuplicates: true,
discardUnused: false,
mergeIdents: false,
sourcemap: true,
});
module.exports = merge(require('./webpack.base.config'), {
mode: 'production',
devtool: 'source-map',
module: {
rules: [{
test: /\.(s?css|sass)$/,
exclude: /app[\\/](components|scenes)[\\/].+\.scss$/,
use: [
MiniCssExtractPlugin.loader,
'style-loader',
'css-loader',
{
loader: 'postcss-loader',
options: {
plugins() {
return [cssnanoConf];
},
},
},
{
loader: 'sass-loader',
options: {
includePaths: ['./node_modules'],
},
},
],
}, {
test: /app[\\/](components|scenes)[\\/].+\.scss$/,
use: [
MiniCssExtractPlugin.loader,
{
loader: 'style-loader',
},
{
loader: 'css-loader',
options: {
modules: true,
localIdentName: '[local]___[hash:base64:5]',
},
},
{
loader: 'postcss-loader',
options: {
plugins() {
return [cssnanoConf];
},
},
},
{
loader: 'sass-loader',
options: {
includePaths: ['./node_modules'],
},
},
],
}],
},
optimization: {
minimizer: [
new UglifyJSPlugin({
uglifyOptions: {
output: {
comments: false,
},
compress: {
unsafe_comps: true,
properties: true,
keep_fargs: false,
pure_getters: true,
unused: true,
hoist_funs: true,
if_return: true,
join_vars: true,
cascade: true,
drop_console: true,
},
},
}),
],
},
plugins: [
new MiniCssExtractPlugin({
filename: 'main-[hash:6].css',
allChunks: true,
}),
new UglifyJSPlugin({}),
new webpack.optimize.ModuleConcatenationPlugin(),
new webpack.LoaderOptionsPlugin({
minimize: true,
}),
],
});
/style.scss
ERROR in ../style.scss
Module build failed: ReferenceError: window is not defined
...
Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
- configuration.module.rules[6].use should be one of these:
non-empty string | function | object { loader?, options?, ident?, query? } | function | [non-empty string | function | object { loader?, options?, ident?, query? }]
-> Modifiers applied to the module when rule is matched
Details:
* configuration.module.rules[5].use should be a string.
* configuration.module.rules[5].use should be an instance of function
* configuration.module.rules[5].use should be an object.
* configuration.module.rules[5].use should be an instance of function
* configuration.module.rules[5].use[1] should be a string.
* configuration.module.rules[5].use[1] should be an instance of function
* configuration.module.rules[5].use[1] has an unknown property 'fallback'. These properties are valid:
object { loader?, options?, ident?, query? }
* configuration.module.rules[6].use should be a string.
* configuration.module.rules[6].use should be an instance of function
* configuration.module.rules[6].use should be an object.
* configuration.module.rules[6].use should be an instance of function
* configuration.module.rules[6].use[1] should be a string.
* configuration.module.rules[6].use[1] should be an instance of function
* configuration.module.rules[6].use[1] has an unknown property 'fallback'. These properties are valid:
object { loader?, options?, ident?, query? }
Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
- configuration.module.rules[6].use should be one of these:
non-empty string | function | object { loader?, options?, ident?, query? } | function | [non-empty string | function | object { loader?, options?, ident?, query? }]
-> Modifiers applied to the module when rule is matched
Details:
* configuration.module.rules[5].use should be a string.
* configuration.module.rules[5].use should be an instance of function
* configuration.module.rules[5].use should be an object.
* configuration.module.rules[5].use should be an instance of function
* configuration.module.rules[5].use[1] should be a string.
* configuration.module.rules[5].use[1] should be an instance of function
* configuration.module.rules[5].use[1] has an unknown property 'fallback'. These properties are valid:
object { loader?, options?, ident?, query? }
* configuration.module.rules[6].use should be a string.
* configuration.module.rules[6].use should be an instance of function
* configuration.module.rules[6].use should be an object.
* configuration.module.rules[6].use should be an instance of function
* configuration.module.rules[6].use[1] should be a string.
* configuration.module.rules[6].use[1] should be an instance of function
* configuration.module.rules[6].use[1] has an unknown property 'fallback'. These properties are valid:
object { loader?, options?, ident?, query? }
"devDependencies": {
"babel-core": "^6.26.0",
"babel-eslint": "^8.0.3",
"babel-jest": "^22.1.0",
"babel-loader": "^7.1.2",
"babel-plugin-react-css-modules": "^3.3.2",
"babel-plugin-react-remove-properties": "^0.2.5",
"babel-plugin-syntax-dynamic-import": "^6.18.0",
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-plugin-transform-decorators-legacy": "^1.3.4",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"babel-plugin-transform-react-remove-prop-types": "^0.4.10",
"babel-plugin-transform-runtime": "^6.23.0",
"babel-preset-env": "^1.6.0",
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",
"babel-preset-stage-1": "^6.24.1",
"babel-preset-stage-2": "^6.24.1",
"babel-register": "^6.26.0",
"copy-webpack-plugin": "^4.5.1",
"cross-env": "^5.1.1",
"css-hot-loader": "^1.3.9",
"css-loader": "^0.28.11",
"cssnano": "^3.10.0",
"eslint": "^4.6.1",
"eslint-config-airbnb": "^16.1.0",
"eslint-import-resolver-webpack": "^0.9.0",
"eslint-plugin-import": "^2.8.0",
"eslint-plugin-jsx-a11y": "^6.0.2",
"eslint-plugin-react": "^7.5.1",
"extract-text-webpack-plugin": "^3.0.2",
"file-loader": "^0.11.2",
"html-webpack-plugin": "^3.2.0",
"husky": "^0.14.3",
"lint-staged": "^6.0.0",
"node-sass": "^4.5.3",
"postcss-loader": "^2.1.3",
"postcss-nested": "^3.0.0",
"postcss-scss": "^1.0.5",
"raw-loader": "^0.5.1",
"sass-loader": "^6.0.6",
"style-loader": "^0.19.0",
"stylelint": "^8.4.0",
"stylelint-config-standard": "^18.0.0",
"stylelint-order": "^0.8.0",
"stylelint-scss": "^2.2.0",
"uglifyjs-webpack-plugin": "^1.2.4",
"url-loader": "^0.5.9",
"webpack": "^4.5.0",
"webpack-bundle-analyzer": "^2.11.1",
"webpack-cli": "^2.0.14",
"webpack-dev-server": "^3.1.1",
"webpack-merge": "^4.1.2"
},
<div styleName="some-class"> .... </div>
'some-class__'