Проблема вот в чем, сделал проект пытаюсь его скомпилировать а он не компилируется, подскажите пожалуйста как это поправить я совсем слабый и только познакомился с webpack.
вот такая ошибка
TypeError: Cannot read property 'compilation' of undefined
at OptimizeCssAssetsWebpackPlugin.apply (C:\Users\Pavel\Documents\GitHub\site\node_modules\last-call-webpack-plugin\src\index.js:170:20)
at Compiler.apply (C:\Users\Pavel\Documents\GitHub\site\node_modules\webpack\node_modules\tapable\lib\Tapable.js:375:16)
at webpack (C:\Users\Pavel\Documents\GitHub\site\node_modules\webpack\lib\webpack.js:32:19)
at err (C:\Users\Pavel\Documents\GitHub\site\build\build.js:18:3)
at next (C:\Users\Pavel\Documents\GitHub\site\node_modules\rimraf\rimraf.js:75:7)
at CB (C:\Users\Pavel\Documents\GitHub\site\node_modules\rimraf\rimraf.js:111:9)
at C:\Users\Pavel\Documents\GitHub\site\node_modules\rimraf\rimraf.js:137:14
at FSReqWrap.oncomplete (fs.js:153:21)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! Havemotion@1.0.0 build: `node build/build.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the Havemotion@1.0.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
и вот такой фаил билда
require('./check-versions')()
process.env.NODE_ENV = 'production'
var ora = require('ora')
var rm = require('rimraf')
var path = require('path')
var chalk = require('chalk')
var webpack = require('webpack')
var config = require('../config')
var webpackConfig = require('./webpack.prod.conf')
var spinner = ora('building for production...')
spinner.start()
rm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), err => {
if (err) throw err
webpack(webpackConfig, function (err, stats) {
spinner.stop()
if (err) throw err
process.stdout.write(stats.toString({
colors: true,
modules: false,
children: false,
chunks: false,
chunkModules: false
}) + '\n\n')
console.log(chalk.cyan(' Build complete.\n'))
console.log(chalk.yellow(
' Tip: built files are meant to be served over an HTTP server.\n' +
' Opening index.html over file:// won\'t work.\n'
))
})
})
Вот webpack
var path = require('path')
var utils = require('./utils')
var webpack = require('webpack')
var config = require('../config')
var merge = require('webpack-merge')
var baseWebpackConfig = require('./webpack.base.conf')
var CopyWebpackPlugin = require('copy-webpack-plugin')
var HtmlWebpackPlugin = require('html-webpack-plugin')
var ExtractTextPlugin = require('extract-text-webpack-plugin')
var OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin')
var env = config.build.env
var webpackConfig = merge(baseWebpackConfig, {
module: {
rules: utils.styleLoaders({
sourceMap: config.build.productionSourceMap,
extract: true
})
},
devtool: config.build.productionSourceMap ? '#source-map' : false,
output: {
path: config.build.assetsRoot,
filename: utils.assetsPath('js/[name].[chunkhash].js'),
chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
},
plugins: [
// http://vuejs.github.io/vue-loader/en/workflow/production.html
new webpack.DefinePlugin({
'process.env': env
}),
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
},
sourceMap: true
}),
// extract css into its own file
new ExtractTextPlugin({
filename: utils.assetsPath('css/[name].[contenthash].css')
}),
// Compress extracted CSS. We are using this plugin so that possible
// duplicated CSS from different components can be deduped.
new OptimizeCSSPlugin({
cssProcessorOptions: {
safe: true
}
}),
// generate dist index.html with correct asset hash for caching.
// you can customize output by editing /index.html
// see https://github.com/ampedandwired/html-webpack-plugin
new HtmlWebpackPlugin({
filename: config.build.index,
template: 'index.html',
inject: true,
minify: {
removeComments: true,
collapseWhitespace: true,
removeAttributeQuotes: true
// more options:
// https://github.com/kangax/html-minifier#options-quick-reference
},
// necessary to consistently work with multiple chunks via CommonsChunkPlugin
chunksSortMode: 'dependency'
}),
// split vendor js into its own file
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
minChunks: function (module, count) {
// any required modules inside node_modules are extracted to vendor
return (
module.resource &&
/\.js$/.test(module.resource) &&
module.resource.indexOf(
path.join(__dirname, '../node_modules')
) === 0
)
}
}),
// extract webpack runtime and module manifest to its own file in order to
// prevent vendor hash from being updated whenever app bundle is updated
new webpack.optimize.CommonsChunkPlugin({
name: 'manifest',
chunks: ['vendor']
}),
// copy custom static assets
new CopyWebpackPlugin([
{
from: path.resolve(__dirname, '../static'),
to: config.build.assetsSubDirectory,
ignore: ['.*']
}
])
]
})
if (config.build.productionGzip) {
var CompressionWebpackPlugin = require('compression-webpack-plugin')
webpackConfig.plugins.push(
new CompressionWebpackPlugin({
asset: '[path].gz[query]',
algorithm: 'gzip',
test: new RegExp(
'\\.(' +
config.build.productionGzipExtensions.join('|') +
')$'
),
threshold: 10240,
minRatio: 0.8
})
)
}
if (config.build.bundleAnalyzerReport) {
var BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
webpackConfig.plugins.push(new BundleAnalyzerPlugin())
}
module.exports = webpackConfig
вот package.json
{
"name": "Havemotion",
"version": "1.0.0",
"description": "Havemotion",
"author": "iVanSh <mail@ivansh.ru>",
"private": true,
"scripts": {
"dev": "node build/dev-server.js",
"build": "node build/build.js",
"lint": "eslint --ext .js,.vue src",
"test": "jest"
},
"dependencies": {
"axios": "^0.18.1",
"babel-polyfill": "^6.23.0",
"bootstrap-vue": "^2.0.0-rc.11",
"detect-browser": "^2.0.0",
"es6-promise": "^4.2.4",
"lodash": "^4.17.15",
"moment": "^2.22.2",
"qs": "^6.8.0",
"vue": "^2.2.2",
"vue-progressbar": "^0.7.1",
"vue-router": "^2.2.0",
"vuex": "^2.2.1"
},
"devDependencies": {
"autoprefixer": "^6.7.2",
"babel-core": "^6.22.1",
"babel-eslint": "^7.1.1",
"babel-loader": "^6.2.10",
"babel-plugin-transform-es2015-arrow-functions": "^6.22.0",
"babel-plugin-transform-runtime": "^6.22.0",
"babel-preset-env": "^1.2.1",
"babel-preset-stage-2": "^6.22.0",
"babel-register": "^6.22.0",
"chalk": "^1.1.3",
"connect-history-api-fallback": "^1.3.0",
"copy-webpack-plugin": "^5.1.1",
"css-loader": "^3.4.1",
"eslint": "^3.14.1",
"eslint-config-airbnb-base": "^11.0.1",
"eslint-friendly-formatter": "^2.0.7",
"eslint-import-resolver-webpack": "^0.8.1",
"eslint-loader": "^1.6.1",
"eslint-plugin-html": "^2.0.0",
"eslint-plugin-import": "^2.2.0",
"eslint-plugin-jest": "^19.0.1",
"eventsource-polyfill": "^0.9.6",
"express": "^4.14.1",
"extract-text-webpack-plugin": "^2.0.0",
"file-loader": "^0.10.0",
"friendly-errors-webpack-plugin": "^1.1.3",
"function-bind": "^1.1.0",
"html-webpack-plugin": "^2.28.0",
"http-proxy-middleware": "^0.20.0",
"jest": "^25.0.0",
"node-sass": "^4.5.1",
"opn": "^4.0.2",
"optimize-css-assets-webpack-plugin": "^5.0.3",
"ora": "^1.1.0",
"pug": "^2.0.0-beta11",
"pug-loader": "^2.3.0",
"rimraf": "^2.6.0",
"sass-loader": "^6.0.3",
"semver": "^5.3.0",
"style-loader": "^0.21.0",
"stylus": "^0.54.5",
"stylus-loader": "^3.0.2",
"url-loader": "^3.0.0",
"vue-loader": "^11.1.4",
"vue-style-loader": "^2.0.5",
"vue-template-compiler": "^2.2.4",
"webpack": "^2.2.1",
"webpack-bundle-analyzer": "^3.6.0",
"webpack-dev-middleware": "^1.10.0",
"webpack-hot-middleware": "^2.16.1",
"webpack-merge": "^4.0.0"
},
"engines": {
"node": ">= 4.0.0",
"npm": ">= 3.0.0"
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 8"
]
}
Помогите пожалуйста, заранее спасибо.
На данный момент, судя по package.json
установлен webpack2, в то время как плагин, на котором падает сборка, установлен для четвертой версии вебпака. Соответственно, либо даунгрейдить плагины (все, под вторую версию), либо апгрейдить вебпак до 4, и, соответственно, плагины для четвертой. С апгрейдом проще, потому как просто обновлять плагины до последней версии проще, чем вылавливать, какая там версия сделана под второй вебпак.
UPD. Вообще судя по пакетам, создаётся впечатление, что проект достался в наследство от древних греков, поэтому тут есть нюанс. Если тот плагин, на котором валится сборка был добавлен Вами, и это единственный плагин, который вы добавляли ( и поэтому он естественно заехал последней версии) то проще и быстрее будет как раз таки откатить его версию на совместимость с вебпак2. Как говорится, дешего и сердито.
Айфон мало держит заряд, разбираемся с проблемой вместе с AppLab
Перевод документов на английский язык: Важность и ключевые аспекты
Подскажите где ошибка в коде - строкаvar SearchControl = new ymapscontrol
Не подскажите ресурс/книгу, где было бы много задач (с ответами) по чистому JS ?
мне нужно простое решение, одной функцией или небольшой однофайловой библиотекой загружаемой в html файле