При выполнении команды: npm run build я получаю эту ошибку:
clean-webpack-plugin: ..../internals/webpack/build has been removed.
Hash: e392cba8ffe45d4ccf3e
Version: webpack 3.5.5
Time: 25347ms
Asset Size Chunks Chunk Names
.htaccess.bin 1.79 kB [emitted]
manifest.json 570 bytes [emitted]
0.4c78ff730ee413b0f722.chunk.js 41 kB 0 [emitted]
1.e85494ada20960940da1.chunk.js 2.42 kB 1 [emitted]
2.fbee78dcf2d2eb0c7313.chunk.js 3.47 kB 2 [emitted]
3.20d0e2989b358867fdd4.chunk.js 24.1 kB 3 [emitted]
main.0a7a3dfce71c313b3759.js 4.98 MB 4 [emitted] main
main.7e2d77a8bd40ea6ad93420543f986fde.css 77.8 kB 4 [emitted] main
index.html 1.67 kB [emitted]
sw.js 17.8 kB [emitted]
ERROR in main.0a7a3dfce71c313b3759.js from UglifyJs
Invalid assignment [main.0a7a3dfce71c313b3759.js:114163,30]
Child html-webpack-plugin for "index.html":
1 asset
Child html-webpack-plugin for "index.html":
1 asset
Child html-webpack-plugin for "index.html":
1 asset
Child __offline_serviceworker:
1 asset
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! react-boilerplate@3.5.0 build: `cross-env NODE_ENV=production webpack --config internals/webpack/webpack.prod.babel.js --color -p --progress --hide-modules --display-optimization-bailout`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the react-boilerplate@3.5.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
Вот мой package.json
{
"name": "react-boilerplate",
"version": "3.5.0",
"description": "A highly scalable, offline-first foundation with the best DX and a focus on performance and best practices",
"repository": {
"type": "git",
"url": "git://github.com/react-boilerplate/react-boilerplate.git"
},
"engines": {
"npm": ">=3",
"node": ">=5"
},
"author": "Max Stoiber",
"license": "MIT",
"scripts": {
"analyze:clean": "rimraf stats.json",
"preanalyze": "npm run analyze:clean",
"analyze": "node ./internals/scripts/analyze.js",
"extract-intl": "babel-node --presets env,stage-0 -- ./internals/scripts/extract-intl.js",
"npmcheckversion": "node ./internals/scripts/npmcheckversion.js",
"preinstall": "npm run npmcheckversion",
"postinstall": "npm run build:dll",
"prebuild": "npm run build:clean",
"build": "cross-env NODE_ENV=production webpack --config internals/webpack/webpack.prod.babel.js --color -p --progress --hide-modules --display-optimization-bailout",
"build:clean": "rimraf ./build",
"build:dll": "node ./internals/scripts/dependencies.js",
"start": "cross-env NODE_ENV=development node server",
"start:tunnel": "cross-env NODE_ENV=development ENABLE_TUNNEL=true node server",
"start:production": "npm run test && npm run build && npm run start:prod",
"start:prod": "cross-env NODE_ENV=production node server",
"presetup": "npm i chalk shelljs",
"setup": "node ./internals/scripts/setup.js",
"postsetup": "npm run build:dll",
"clean": "shjs ./internals/scripts/clean.js",
"clean:all": "npm run analyze:clean && npm run test:clean && npm run build:clean",
"generate": "plop --plopfile internals/generators/index.js",
"lint": "npm run lint:js",
"lint:eslint": "eslint --ignore-path .gitignore --ignore-pattern internals/scripts",
"lint:js": "npm run lint:eslint -- . ",
"lint:staged": "lint-staged",
"pretest": "npm run test:clean && npm run lint",
"test:clean": "rimraf ./coverage",
"test": "cross-env NODE_ENV=test jest --coverage",
"test:watch": "cross-env NODE_ENV=test jest --watchAll",
"coveralls": "cat ./coverage/lcov.info | coveralls"
},
"lint-staged": {
"*.js": "lint:eslint"
},
"pre-commit": "lint:staged",
"babel": {
"plugins": [
"styled-components"
],
"presets": [
[
"env",
{
"modules": false
}
],
"react",
"stage-0"
],
"env": {
"production": {
"only": [
"app"
],
"plugins": [
"transform-react-remove-prop-types",
"transform-react-constant-elements",
"transform-react-inline-elements"
]
},
"test": {
"plugins": [
"transform-es2015-modules-commonjs",
"dynamic-import-node"
]
}
}
},
"eslintConfig": {
"parser": "babel-eslint",
"extends": "airbnb",
"env": {
"browser": true,
"node": true,
"jest": true,
"es6": true
},
"plugins": [
"redux-saga",
"react",
"jsx-a11y"
],
"parserOptions": {
"ecmaVersion": 6,
"sourceType": "module",
"ecmaFeatures": {
"jsx": true
}
},
"rules": {
"arrow-parens": [
"error",
"always"
],
"arrow-body-style": [
2,
"as-needed"
],
"class-methods-use-this": 0,
"comma-dangle": [
2,
"always-multiline"
],
"import/imports-first": 0,
"import/newline-after-import": 0,
"import/no-dynamic-require": 0,
"import/no-extraneous-dependencies": 0,
"import/no-named-as-default": 0,
"import/no-unresolved": 2,
"import/no-webpack-loader-syntax": 0,
"import/prefer-default-export": 0,
"indent": [
2,
2,
{
"SwitchCase": 1
}
],
"jsx-a11y/aria-props": 2,
"jsx-a11y/heading-has-content": 0,
"jsx-a11y/href-no-hash": 2,
"jsx-a11y/label-has-for": 2,
"jsx-a11y/mouse-events-have-key-events": 2,
"jsx-a11y/role-has-required-aria-props": 2,
"jsx-a11y/role-supports-aria-props": 2,
"max-len": 0,
"newline-per-chained-call": 0,
"no-confusing-arrow": 0,
"no-console": 1,
"no-use-before-define": 0,
"prefer-template": 2,
"react/forbid-prop-types": 0,
"react/jsx-first-prop-new-line": [
2,
"multiline"
],
"react/jsx-filename-extension": 0,
"react/jsx-no-target-blank": 0,
"react/require-default-props": 0,
"react/require-extension": 0,
"react/self-closing-comp": 0,
"redux-saga/no-yield-in-race": 2,
"redux-saga/yield-effects": 2,
"require-yield": 0
},
"settings": {
"import/resolver": {
"webpack": {
"config": "./internals/webpack/webpack.prod.babel.js"
}
}
}
},
"dllPlugin": {
"path": "node_modules/react-boilerplate-dlls",
"exclude": [
"chalk",
"compression",
"cross-env",
"express",
"ip",
"minimist",
"sanitize.css"
],
"include": [
"core-js",
"lodash",
"eventsource-polyfill"
]
},
"jest": {
"collectCoverageFrom": [
"app/**/*.{js,jsx}",
"!app/**/*.test.{js,jsx}",
"!app/*/RbGenerated*/*.{js,jsx}",
"!app/app.js",
"!app/global-styles.js",
"!app/*/*/Loadable.{js,jsx}"
],
"coverageThreshold": {
"global": {
"statements": 98,
"branches": 91,
"functions": 98,
"lines": 98
}
},
"moduleDirectories": [
"node_modules",
"app"
],
"moduleNameMapper": {
".*\\.(css|less|styl|scss|sass)$": "<rootDir>/internals/mocks/cssModule.js",
".*\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/internals/mocks/image.js"
},
"setupTestFrameworkScriptFile": "<rootDir>/internals/testing/test-bundler.js",
"testRegex": "tests/.*\\.test\\.js$"
},
"dependencies": {
"@fortawesome/fontawesome": "^1.1.8",
"@fortawesome/react-fontawesome": "0.0.18",
"@material-ui/core": "^1.4.2",
"@material-ui/icons": "^1.1.0",
"babel-polyfill": "6.23.0",
"babel-preset-es2015": "^6.24.1",
"chalk": "1.1.3",
"child_process": "1.0.2",
"cls-bluebird": "^2.1.0",
"compression": "^1.7.3",
"cross-env": "5.0.0",
"email-validator": "^2.0.4",
"express": "^4.16.3",
"fontfaceobserver": "2.0.9",
"fs": "0.0.1-security",
"history": "^4.7.2",
"hoist-non-react-statics": "2.1.1",
"immutable": "3.8.1",
"intl": "1.2.5",
"invariant": "2.2.2",
"ip": "1.1.5",
"js-file-download": "^0.4.4",
"lodash": "^4.17.10",
"marquee-react-dwyer": "^5.7.9",
"material-ui": "^1.0.0-beta.46",
"minimist": "1.2.0",
"net": "^1.0.2",
"prop-types": "15.5.10",
"query-string": "^6.2.0",
"re-carousel": "^2.0.9",
"react": "^16.4.2",
"react-addons-css-transition-group": "^15.6.2",
"react-countdown-now": "^1.3.0",
"react-device-detect": "^1.5.9",
"react-dom": "^16.4.2",
"react-helmet": "5.1.3",
"react-html-parser": "^2.0.2",
"react-intl": "2.3.0",
"react-loadable": "4.0.3",
"react-marquee": "^0.1.1",
"react-paypal-express-checkout": "^1.0.4",
"react-redux": "5.0.5",
"react-router-dom": "4.1.1",
"react-router-redux": "5.0.0-alpha.6",
"react-smooth-marquee": "^1.0.0",
"react-sticky-el": "^1.0.20",
"react-swipeable-views": "^0.12.16",
"react-text-marquee": "^1.0.1",
"react-text-mask": "^5.4.3",
"react-tooltip": "^3.6.1",
"redux": "3.6.0",
"redux-immutable": "4.0.0",
"redux-localstorage": "^0.4.1",
"redux-persist": "^5.10.0",
"redux-saga": "^0.15.6",
"redux-thunk": "^2.3.0",
"reselect": "3.0.1",
"sanitize.css": "4.1.0",
"scroll-events": "^1.1.3",
"styled-components": "2.0.0",
"tls": "0.0.1",
"url": "^0.11.0",
"warning": "3.0.0",
"whatwg-fetch": "2.0.3"
},
"devDependencies": {
"add-asset-html-webpack-plugin": "2.0.1",
"babel-cli": "^6.26.0",
"babel-core": "^6.26.3",
"babel-eslint": "7.2.3",
"babel-loader": "7.1.0",
"babel-plugin-dynamic-import-node": "^1.2.0",
"babel-plugin-react-intl": "2.3.1",
"babel-plugin-react-transform": "2.0.2",
"babel-plugin-styled-components": "1.1.4",
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-plugin-transform-es2015-arrow-functions": "^6.22.0",
"babel-plugin-transform-es2015-classes": "^6.24.1",
"babel-plugin-transform-es2015-function-name": "^6.24.1",
"babel-plugin-transform-es2015-modules-commonjs": "^6.26.2",
"babel-plugin-transform-object-assign": "^6.22.0",
"babel-plugin-transform-react-constant-elements": "6.23.0",
"babel-plugin-transform-react-inline-elements": "6.22.0",
"babel-plugin-transform-react-remove-prop-types": "0.4.5",
"babel-preset-env": "^1.7.0",
"babel-preset-react": "6.24.1",
"babel-preset-stage-0": "6.24.1",
"babel-preset-stage-2": "^6.24.1",
"babel-preset-stage-3": "^6.24.1",
"babel-runtime": "^6.26.0",
"circular-dependency-plugin": "3.0.0",
"clean-webpack-plugin": "0.1.17",
"coveralls": "^3.0.2",
"css-loader": "0.28.4",
"enzyme": "2.8.2",
"eslint": "3.19.0",
"eslint-config-airbnb": "15.0.1",
"eslint-config-airbnb-base": "11.2.0",
"eslint-import-resolver-webpack": "0.8.3",
"eslint-plugin-import": "2.7.0",
"eslint-plugin-jsx-a11y": "5.0.3",
"eslint-plugin-react": "7.0.1",
"eslint-plugin-redux-saga": "0.3.0",
"eventsource-polyfill": "0.9.6",
"exports-loader": "0.6.4",
"extract-text-webpack-plugin": "3.0.2",
"file-loader": "0.11.1",
"html-loader": "0.4.5",
"html-webpack-plugin": "2.29.0",
"image-webpack-loader": "^4.5.0",
"imports-loader": "0.7.1",
"jest-cli": "^23.6.0",
"lint-staged": "3.5.1",
"ngrok": "2.2.9",
"node-plop": "0.7.0",
"null-loader": "0.1.1",
"offline-plugin": "^5.0.5",
"plop": "1.8.0",
"pre-commit": "1.2.2",
"react-test-renderer": "15.6.1",
"rimraf": "2.6.1",
"shelljs": "0.7.7",
"style-loader": "0.18.1",
"uglifyjs-webpack-plugin": "^2.0.1",
"url-loader": "^1.0.1",
"webpack": "3.5.5",
"webpack-dev-middleware": "1.11.0",
"webpack-hot-middleware": "2.18.0"
}
}
Вот webpack.base.babel.js
/**
* COMMON WEBPACK CONFIGURATION
*/
const path = require('path');
const webpack = require('webpack');
// Remove this line once the following warning goes away (it was meant for webpack loader authors not users):
// 'DeprecationWarning: loaderUtils.parseQuery() received a non-string value which can be problematic,
// see https://github.com/webpack/loader-utils/issues/56 parseQuery() will be replaced with getOptions()
// in the next major version of loader-utils.'
// process.noDeprecation = true;
module.exports = (options) => ({
entry: options.entry,
output: Object.assign({ // Compile into js/build.js
path: path.resolve(process.cwd(), 'build'),
publicPath: '/',
}, options.output), // Merge with env dependent settings
module: {
rules: [
{
test: /\.js$/, // Transform all .js files required somewhere with Babel
exclude: /node_modules/,
use: {
loader: 'babel-loader',
options: {
plugins: [
"transform-object-assign",
["transform-es2015-arrow-functions", { "spec": true }],
["transform-class-properties", { "spec": true }],
'transform-es2015-classes',
'transform-es2015-modules-commonjs',
'transform-es2015-function-name',
],
presets: ["es2015", "stage-2", "react" ]
},
},
},
{
// Preprocess our own .css files
// This is the place to add your own loaders (e.g. sass/less etc.)
// for a list of loaders, see https://webpack.js.org/loaders/#styling
test: /\.css$/,
exclude: /node_modules/,
// use: ['style-loader', 'css-loader'],
use: options.cssLoaders,
},
{
// Preprocess 3rd party .css files located in node_modules
test: /\.css$/,
include: /node_modules/,
use: ['style-loader', 'css-loader'],
},
{
test: /\.(eot|svg|otf|ttf|woff|woff2)$/,
use: 'file-loader',
},
{
test: /\.(jpg|png|gif)$/,
use: [
'file-loader',
{
loader: 'image-webpack-loader',
options: {
progressive: true,
optimizationLevel: 7,
interlaced: false,
pngquant: {
quality: '65-90',
speed: 4,
},
},
},
],
},
{
test: /\.html$/,
use: 'html-loader',
},
{
test: /\.json$/,
use: 'json-loader',
},
{
test: /\.(mp4|webm)$/,
use: {
loader: 'url-loader',
options: {
limit: 10000,
},
},
},
],
},
plugins: options.plugins.concat([
new webpack.ProvidePlugin({
// make fetch available
fetch: 'exports-loader?self.fetch!whatwg-fetch',
}),
// Always expose NODE_ENV to webpack, in order to use `process.env.NODE_ENV`
// inside your code for any environment checks; UglifyJS will automatically
// drop any unreachable code.
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: JSON.stringify(process.env.NODE_ENV),
},
}),
new webpack.NamedModulesPlugin(),
]),
resolve: {
modules: ['app', 'node_modules'],
extensions: [
'.js',
'.jsx',
'.react.js',
],
mainFields: [
'browser',
'jsnext:main',
'main',
],
},
devtool: options.devtool,
target: 'web', // Make web variables accessible to webpack, e.g. window
performance: options.performance || {},
});
Вот webpack.prod.babel.js
// Important modules this config uses
const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const OfflinePlugin = require('offline-plugin');
const Clean = require('clean-webpack-plugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
module.exports = require('./webpack.base.babel')({
// In production, we skip all hot-reloading stuff
entry: [
path.join(process.cwd(), 'app/app.js'),
],
// Utilize long-term caching by adding content hashes (not compilation hashes) to compiled assets
output: {
filename: '[name].[chunkhash].js',
chunkFilename: '[name].[chunkhash].chunk.js',
},
// We use ExtractTextPlugin so we get a seperate CSS file instead
// of the CSS being in the JS and injected as a style tag
cssLoaders: ExtractTextPlugin.extract({
fallback: 'style-loader',
use: {
loader: 'css-loader',
options: {
camelCase: true,
modules: true,
importLoaders: 1,
},
},
}),
plugins: [
new Clean(['build']),
new webpack.optimize.ModuleConcatenationPlugin(),
new ExtractTextPlugin({
filename: '[name].[contenthash].css',
ignoreOrder: true,
allChunks: true,
}),
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
children: true,
minChunks: 2,
async: true,
}),
// Minify and optimize the index.html
new HtmlWebpackPlugin({
template: 'app/404.html',
minify: {
removeComments: true,
collapseWhitespace: true,
removeRedundantAttributes: true,
useShortDoctype: true,
removeEmptyAttributes: true,
removeStyleLinkTypeAttributes: true,
keepClosingSlash: true,
minifyJS: true,
minifyCSS: true,
minifyURLs: true,
},
inject: true,
}),
new HtmlWebpackPlugin({
template: 'app/index.html',
minify: {
removeComments: true,
collapseWhitespace: true,
removeRedundantAttributes: true,
useShortDoctype: true,
removeEmptyAttributes: true,
removeStyleLinkTypeAttributes: true,
keepClosingSlash: true,
minifyJS: true,
minifyCSS: true,
minifyURLs: true,
},
inject: true,
}),
new HtmlWebpackPlugin({
template: 'app/500.html',
minify: {
removeComments: true,
collapseWhitespace: true,
removeRedundantAttributes: true,
useShortDoctype: true,
removeEmptyAttributes: true,
removeStyleLinkTypeAttributes: true,
keepClosingSlash: true,
minifyJS: true,
minifyCSS: true,
minifyURLs: true,
},
inject: true,
}),
// Put it in the end to capture all the HtmlWebpackPlugin's
// assets manipulations and do leak its manipulations to HtmlWebpackPlugin
new OfflinePlugin({
relativePaths: false,
publicPath: '/',
// No need to cache .htaccess. See http://mxs.is/googmp,
// this is applied before any match in `caches` section
excludes: ['.htaccess'],
caches: {
main: [':rest:'],
// All chunks marked as `additional`, loaded after main section
// and do not prevent SW to install. Change to `optional` if
// do not want them to be preloaded at all (cached only when first loaded)
additional: ['*.chunk.js'],
},
// Removes warning for about `additional` section usage
safeToUseOptionalCaches: true,
AppCache: false,
}),
],
performance: {
assetFilter: (assetFilename) => !(/(\.map$)|(^(main\.|favicon\.))/.test(assetFilename)),
},
});
Пробные варианты:
- Я пытался сначала добавить модули для предварительной компиляции кода, так как многие посты говорят, что uglifyJSтолько читает ES5.Я перепробовал все те, которые я могу придумать, которые имеют отношение к делу.Может быть, я пропустил один?
- Я также пытался переупорядочить плагины в файле
webpack.base.babel.js.и переупорядочить пресеты.Либо ничего не происходит, либо возникает другая ошибка того же рода.
Это, вероятно, что-то маленькое ... Есть идеи, что я делаю неправильно?Или как исправить?
Версии
React-Boilerplate: 3.5.0
Узел / NPM:6.1.0