Skip to content

Commit

Permalink
Update Webpack to 5.0.0-alpha (+ other dependencies)
Browse files Browse the repository at this point in the history
  • Loading branch information
@Lyrkan
Lyrkan committed Oct 5, 2019
1 parent 5640271 commit e4e9c27
Show file tree
Hide file tree
Showing 19 changed files with 1,411 additions and 1,350 deletions.
28 changes: 28 additions & 0 deletions index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -916,6 +916,34 @@ class Encore {
return this;
}

/**
* Configure the mini-css-extract-plugin.
*
* https://github.com/webpack-contrib/mini-css-extract-plugin#configuration
*
* ```
* Encore.configureMiniCssExtractPlugin(
* function(loaderConfig) {
* // change the loader's config
* // loaderConfig.reloadAll = true;
* },
* function(pluginConfig) {
* // change the plugin's config
* // pluginConfig.chunkFilename = '[id].css';
* }
* );
* ```
*
* @param {function} loaderOptionsCallback
* @param {function} pluginOptionsCallback
* @returns {Encore}
*/
configureMiniCssExtractPlugin(loaderOptionsCallback, pluginOptionsCallback = () => {}) {
webpackConfig.configureMiniCssExtractPlugin(loaderOptionsCallback, pluginOptionsCallback);

return this;
}

/**
* If enabled, the react preset is added to Babel.
*
Expand Down
15 changes: 15 additions & 0 deletions lib/WebpackConfig.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -147,6 +147,8 @@ class WebpackConfig {
this.eslintLoaderOptionsCallback = () => {};
this.tsConfigurationCallback = () => {};
this.handlebarsConfigurationCallback = () => {};
this.miniCssExtractLoaderConfigurationCallback = () => {};
this.miniCssExtractPluginConfigurationCallback = () => {};
this.loaderConfigurationCallbacks = {
javascript: () => {},
css: () => {},
Expand Down Expand Up @@ -454,6 +456,19 @@ class WebpackConfig {
this.cssLoaderConfigurationCallback = callback;
}

configureMiniCssExtractPlugin(loaderOptionsCallback, pluginOptionsCallback = () => {}) {
if (typeof loaderOptionsCallback !== 'function') {
throw new Error('Argument 1 to configureMiniCssExtractPluginLoader() must be a callback function.');
}

if (typeof pluginOptionsCallback !== 'function') {
throw new Error('Argument 2 to configureMiniCssExtractPluginLoader() must be a callback function.');
}

this.miniCssExtractLoaderConfigurationCallback = loaderOptionsCallback;
this.miniCssExtractPluginConfigurationCallback = pluginOptionsCallback;
}

enableSingleRuntimeChunk() {
this.shouldUseSingleRuntimeChunk = true;
}
Expand Down
28 changes: 3 additions & 25 deletions lib/config-generator.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,6 @@ const miniCssExtractPluginUtil = require('./plugins/mini-css-extract');
const deleteUnusedEntriesPluginUtil = require('./plugins/delete-unused-entries');
const entryFilesManifestPlugin = require('./plugins/entry-files-manifest');
const manifestPluginUtil = require('./plugins/manifest');
const versioningPluginUtil = require('./plugins/versioning');
const variableProviderPluginUtil = require('./plugins/variable-provider');
const cleanPluginUtil = require('./plugins/clean');
const definePluginUtil = require('./plugins/define');
Expand Down Expand Up @@ -423,9 +422,7 @@ class ConfigGenerator {
buildPluginsConfig() {
const plugins = [];

if (this.webpackConfig.extractCss) {
miniCssExtractPluginUtil(plugins, this.webpackConfig);
}
miniCssExtractPluginUtil(plugins, this.webpackConfig);

// register the pure-style entries that should be deleted
deleteUnusedEntriesPluginUtil(plugins, this.webpackConfig);
Expand All @@ -435,8 +432,6 @@ class ConfigGenerator {
// Dump the manifest.json file
manifestPluginUtil(plugins, this.webpackConfig);

versioningPluginUtil(plugins, this.webpackConfig);

variableProviderPluginUtil(plugins, this.webpackConfig);

cleanPluginUtil(plugins, this.webpackConfig);
Expand Down Expand Up @@ -489,29 +484,12 @@ class ConfigGenerator {
terserPluginUtil(this.webpackConfig),
optimizeCssAssetsUtil(this.webpackConfig)
];
} else {
// see versioning.js: this gives us friendly module names,
// which can be useful for debugging, especially with HMR
optimization.namedModules = true;
}
// https://github.com/webpack/webpack/issues/8354
// likely can be removed in Webpack 5
// https://github.com/webpack/webpack/pull/8374
optimization.chunkIds = 'named';

let splitChunks = {
const splitChunks = {
chunks: this.webpackConfig.shouldSplitEntryChunks ? 'all' : 'async'
};

// This causes the split filenames (& internal names) to be,
// for example, 0.js. This is needed so that the filename
// doesn't change suddenly when another entry needs that same
// shared code (e.g. vendor~entry1~entry2.js).
// https://github.com/webpack/webpack/issues/8426#issuecomment-442375207
if (this.webpackConfig.shouldSplitEntryChunks && this.webpackConfig.isProduction()) {
splitChunks.name = false;
}

if (this.webpackConfig.sharedCommonsEntryName) {
const cacheGroups = {};
cacheGroups[this.webpackConfig.sharedCommonsEntryName] = {
Expand Down Expand Up @@ -599,7 +577,7 @@ class ConfigGenerator {

buildWatchOptionsConfig() {
const watchOptions = {
ignored: /node_modules/
ignored: 'node_modules'
};

return applyOptionsCallback(
Expand Down
14 changes: 13 additions & 1 deletion lib/loaders/css-extract.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@

const WebpackConfig = require('../WebpackConfig'); //eslint-disable-line no-unused-vars
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const applyOptionsCallback = require('../utils/apply-options-callback');

module.exports = {
/**
Expand All @@ -32,6 +33,17 @@ module.exports = {
}, ...loaders];
}

return [MiniCssExtractPlugin.loader, ...loaders];
// Default options
const options = {
hmr: webpackConfig.useHotModuleReplacementPlugin(),
};

return [{
loader: MiniCssExtractPlugin.loader,
options: applyOptionsCallback(
webpackConfig.miniCssExtractLoaderConfigurationCallback,
options
),
}, ...loaders];
}
};
5 changes: 3 additions & 2 deletions lib/loaders/css.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,8 +29,9 @@ module.exports = {
// is used, we set it to 1, so that postcss-loader is applied
// to @import resources.
importLoaders: usePostCssLoader ? 1 : 0,
modules: useCssModules,
localIdentName: '[local]_[hash:base64:5]',
modules: useCssModules ? {
localIdentName: '[local]_[hash:base64:5]',
} : false,
};

const cssLoaders = [
Expand Down
13 changes: 12 additions & 1 deletion lib/plugins/mini-css-extract.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,13 +12,19 @@
const WebpackConfig = require('../WebpackConfig'); //eslint-disable-line no-unused-vars
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const PluginPriorities = require('./plugin-priorities');
const applyOptionsCallback = require('../utils/apply-options-callback');

/**
* @param {Array} plugins
* @param {WebpackConfig} webpackConfig
* @return {void}
*/
module.exports = function(plugins, webpackConfig) {
// Don't add the plugin if CSS extraction is disabled
if (!webpackConfig.extractCss) {
return;
}

// Default filename can be overridden using Encore.configureFilenames({ css: '...' })
let filename = webpackConfig.useVersioning ? '[name].[contenthash:8].css' : '[name].css';
// the chunk filename should use [id], not [name]. But, due
Expand All @@ -45,7 +51,12 @@ module.exports = function(plugins, webpackConfig) {
};

plugins.push({
plugin: new MiniCssExtractPlugin(miniCssPluginOptions),
plugin: new MiniCssExtractPlugin(
applyOptionsCallback(
webpackConfig.miniCssExtractPluginConfigurationCallback,
miniCssPluginOptions
)
),
priority: PluginPriorities.MiniCssExtractPlugin
});
};
31 changes: 20 additions & 11 deletions lib/webpack/delete-unused-entries-js-plugin.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,26 +19,35 @@ DeleteUnusedEntriesJSPlugin.prototype.apply = function(compiler) {
compilation.chunks.forEach((chunk) => {
// see of this chunk is one that needs its .js deleted
if (this.entriesToDelete.includes(chunk.name)) {
let fileDeleteCount = 0;

// loop over the output files and find the 1 that ends in .js
// loop in reverse, to avoid issues as we remove items from chunk.files
for (let i = chunk.files.length - 1; i >= 0; --i) {
let filename = chunk.files[i];
if (/\.js(\.map)?(\?[^.]*)?$/.test(filename)) {
fileDeleteCount++;
const removedFiles = [];

// look for main files to delete first
for (const filename of Array.from(chunk.files)) {
if (/\.js?(\?[^.]*)?$/.test(filename)) {
removedFiles.push(filename);
// remove the output file
delete compilation.assets[filename];
// remove the file, so that it does not dump in the manifest
chunk.files.delete(filename);
}
}

// then also look in auxiliary files for source maps
for (const filename of Array.from(chunk.auxiliaryFiles)) {
if (removedFiles.map(name => `${name}.map`).includes(`${filename}`)) {
removedFiles.push(filename);
// remove the output file
delete compilation.assets[filename];
// remove the file, so that it does not dump in the manifest
chunk.files.splice(chunk.files.indexOf(filename), 1);
chunk.auxiliaryFiles.delete(filename);
}
}

// sanity check: make sure 1 or 2 files were deleted
// if there's some edge case where more .js files
// or 0 .js files might be deleted, I'd rather error
if (fileDeleteCount === 0 || fileDeleteCount > 2) {
throw new Error(`Problem deleting JS entry for ${chunk.name}: ${fileDeleteCount} files were deleted`);
if (removedFiles.length === 0 || removedFiles.length > 2) {
throw new Error(`Problem deleting JS entry for ${chunk.name}: ${removedFiles.length} files were deleted (${removedFiles.join(', ')})`);
}
}
});
Expand Down
2 changes: 1 addition & 1 deletion lib/webpack/shared-entry-concat-plugin.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ function getChunkFilename(compilation, chunkName) {
throw new Error(`Cannot find chunk ${chunkName}`);
}

const jsFiles = chunk.files.filter(filename => {
const jsFiles = Array.from(chunk.files).filter(filename => {
const fileExtension = getFileExtension(filename);
return /^js$/.test(fileExtension) && !additionalChunkAssets.includes(filename);
});
Expand Down
27 changes: 14 additions & 13 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,26 +32,27 @@
"babel-loader": "^8.0.0",
"chalk": "^2.4.1",
"clean-webpack-plugin": "^0.1.19",
"css-loader": "^2.1.1",
"css-loader": "^3.2.0",
"fast-levenshtein": "^2.0.6",
"file-loader": "^1.1.10",
"file-loader": "^4.2.0",
"friendly-errors-webpack-plugin": "^2.0.0-beta.1",
"fs-extra": "^2.0.0",
"loader-utils": "^1.1.0",
"lodash": ">=3.5 <5",
"mini-css-extract-plugin": ">=0.4.0 <0.4.3",
"mini-css-extract-plugin": "^0.8.0",
"optimize-css-assets-webpack-plugin": "^5.0.1",
"pkg-up": "^1.0.0",
"pretty-error": "^2.1.1",
"resolve-url-loader": "^3.0.1",
"semver": "^5.5.0",
"style-loader": "^0.21.0",
"terser-webpack-plugin": "^1.1.0",
"tapable": "^1.0.0",
"terser-webpack-plugin": "^2.1.2",
"tmp": "^0.0.33",
"webpack": "^4.20.0",
"webpack-cli": "^3.0.0",
"webpack": "^5.0.0-alpha.29",
"webpack-cli": "^3.3.9",
"webpack-dev-server": "^3.1.14",
"webpack-manifest-plugin": "^2.0.2",
"webpack-manifest-plugin": "^2.2.0",
"webpack-sources": "^1.3.0",
"yargs-parser": "^12.0.0"
},
Expand All @@ -66,7 +67,7 @@
"chai-fs": "^1.0.0",
"core-js": "^3.0.0",
"eslint": "^5.15.2",
"eslint-loader": "^2.1.2",
"eslint-loader": "^3.0.2",
"eslint-plugin-header": "^1.0.0",
"eslint-plugin-import": "^2.8.0",
"eslint-plugin-node": "^8.0.1",
Expand All @@ -83,16 +84,16 @@
"preact-compat": "^3.17.0",
"sass": "^1.17.0",
"sass-loader": "^7.0.1",
"sinon": "^2.3.4",
"sinon": "^7.5.0",
"strip-ansi": "^5.0.0",
"stylus": "^0.54.5",
"stylus-loader": "^3.0.2",
"ts-loader": "^5.3.0",
"typescript": "^2.3.4",
"url-loader": "^1.0.1 || ^2.0.1",
"vue": "^2.3.4",
"vue-loader": "^15.0.11",
"vue-template-compiler": "^2.3.4",
"url-loader": "^2.1.0",
"vue": "^2.6.10",
"vue-loader": "^15.7.1",
"vue-template-compiler": "^2.6.10",
"webpack-notifier": "^1.6.0",
"zombie": "^6.1.4"
},
Expand Down

0 comments on commit e4e9c27

Please sign in to comment.