Я использую webpack и Angular 6. Со вчерашнего дня и без видимых изменений в файлах css я не компилировал сборку npm run: aot: prod из-за проблемы с созданием main-xxx.css, ошибка bugsnag сообщает мне, что это пытается переписать уже существующий файл и не завершает сборку.
Забавно, что на сервере deploy, если он правильно компилируется, а на моем компьютере это не так, я получаю следующую ошибку: Конфликт (409) - дублированный файл исходной карты для dist / main-f751fc480956a7a013da.css. Этим утром был момент, когда он завершил сборку, но в большинстве случаев - нет. Я нашел решение для настройки override: true в BugsnagSourceMapUploaderPlugin, но мне это не нравится, так как раньше эта ошибка никогда не воспроизводилась.
Похоже, он дважды пытается скомпилировать css (созданный с помощью sass).
Если кто-то столкнулся с такой же проблемой или знает, как отлаживать, чтобы найти неисправность, это мне очень поможет. Заранее большое спасибо.
Это моя конфигурация webpack-prod
/**
* @author: @AngularClass
*/
const helpers = require('./helpers');
const buildUtils = require('./build-utils');
/**
* Used to merge webpack configs
*/
const webpackMerge = require('webpack-merge');
/**
* The settings that are common to prod and dev
*/
const commonConfig = require('./webpack.common.js');
/**
* Webpack Plugins
*/
const SourceMapDevToolPlugin = require('webpack/lib/SourceMapDevToolPlugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const HashedModuleIdsPlugin = require('webpack/lib/HashedModuleIdsPlugin');
const PurifyPlugin = require('@angular-devkit/build-optimizer').PurifyPlugin;
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
const {BugsnagSourceMapUploaderPlugin} = require('webpack-bugsnag-plugins');
function getUglifyOptions(supportES2015) {
const uglifyCompressOptions = {
pure_getters: true, /* buildOptimizer */
// PURE comments work best with 3 passes.
// See https://github.com/webpack/webpack/issues/2899#issuecomment-317425926.
passes: 3 /* buildOptimizer */
};
return {
ecma: supportES2015 ? 6 : 5,
warnings: false, // TODO verbose based on option?
ie8: false,
mangle: true,
compress: uglifyCompressOptions,
output: {
ascii_only: true,
comments: false
}
};
}
module.exports = function (env) {
const ENV = process.env.NODE_ENV = process.env.ENV = 'production';
const supportES2015 = buildUtils.supportES2015(buildUtils.DEFAULT_METADATA.tsConfigPath);
const METADATA = Object.assign({}, buildUtils.DEFAULT_METADATA, {
host: process.env.HOST || 'localhost',
port: process.env.PORT || 8080,
ENV: ENV,
HMR: false
});
// set environment suffix so these environments are loaded.
//METADATA.envFileSuffix = METADATA.E2E ? 'e2e.prod' : 'prod';
METADATA.envFileSuffix = METADATA.envFileSuffix || 'pre';
return webpackMerge(commonConfig({env: ENV, metadata: METADATA}), {
/**
* Options affecting the output of the compilation.
*
* See: http://webpack.github.io/docs/configuration.html#output
*/
output: {
/**
* The output directory as absolute path (required).
*
* See: http://webpack.github.io/docs/configuration.html#output-path
*/
path: helpers.root('dist'),
/**
* Specifies the name of each output file on disk.
* IMPORTANT: You must not specify an absolute path here!
*
* See: http://webpack.github.io/docs/configuration.html#output-filename
*/
filename: '[name].[chunkhash].bundle.js',
/**
* The filename of the SourceMaps for the JavaScript files.
* They are inside the output.path directory.
*
* See: http://webpack.github.io/docs/configuration.html#output-sourcemapfilename
*/
sourceMapFilename: '[file].map',
/**
* The filename of non-entry chunks as relative path
* inside the output.path directory.
*
* See: http://webpack.github.io/docs/configuration.html#output-chunkfilename
*/
chunkFilename: '[name].[chunkhash].chunk.js'
},
module: {
rules: [
/**
* Extract CSS files from .src/styles directory to external CSS file
*/
{
test: /\.css$/,
use: [MiniCssExtractPlugin.loader, 'css-loader'],
include: [helpers.root('src', 'styles')]
},
/**
* Extract and compile SCSS files from .src/styles directory to external CSS file
*/
{
test: /\.scss$/,
use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader'],
include: [helpers.root('src', 'styles')]
}
]
},
/**
* Add additional plugins to the compiler.
*
* See: http://webpack.github.io/docs/configuration.html#plugins
*/
plugins: [
new SourceMapDevToolPlugin({
filename: '[file].map[query]',
moduleFilenameTemplate: '[resource-path]',
fallbackModuleFilenameTemplate: '[resource-path]?[hash]',
sourceRoot: 'webpack:///'
}),
new MiniCssExtractPlugin({ filename: '[name]-[hash].css', chunkFilename: '[name]-[chunkhash].css' }),
new PurifyPlugin(), /* buildOptimizer */
new HashedModuleIdsPlugin(),
/**
* Plugin: UglifyJsPlugin
* Description: Minimize all JavaScript output of chunks.
* Loaders are switched into minimizing mode.
*
* See: https://webpack.github.io/docs/list-of-plugins.html#uglifyjsplugin
*
* NOTE: To debug prod builds uncomment //debug lines and comment //prod lines
*/
new UglifyJsPlugin({
sourceMap: false,
parallel: true,
uglifyOptions: getUglifyOptions(supportES2015)
}),
new BugsnagSourceMapUploaderPlugin({
apiKey: METADATA.bugsnagKey,
publicPath: 'dist'
})
],
/**
* Include polyfills or mocks for various node stuff
* Description: Node configuration
*
* See: https://webpack.github.io/docs/configuration.html#node
*/
node: {
global: true,
crypto: 'empty',
process: false,
module: false,
clearImmediate: false,
setImmediate: false
}
});
};Наконец, по прошествии долгих дней я обнаружил, что ошибка была вызвана ошибкой, так как файл существовал, это не проблема веб-пакета или сборки. Исправлена активация опции overwrite: true в BugsnagSourceMapUploaderPlugin или удаление sourMap. Я не понимаю, как сборка не компилируется для такой ошибки.





Да, Ксавьер прав. Я была такая же проблема. Он находился в файле webpack.prod.js. По умолчанию перезапись отключена. Я искал в проекте appVersion.
new BugsnagSourceMapUploaderPlugin({
apiKey: 'YOUR_API_KEY',
appVersion: '4.0.0.038',
overwrite: true
})
Подробности можно найти здесь на странице BugSnag GitHub.
Попробуйте построить без исходных карт, на angular cli это делается с помощью --source-map = false