-
Notifications
You must be signed in to change notification settings - Fork 808
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* Update dependencies * Update node version 12.x is the current LTS release * Update plugins Tappable methods were deprecated in webpack 4 and webpack 5 now requires the use of hooks. * Rework build callback plugin test Use a real compiler because the compiler internals can change, and in this case, have changed. * Work around Vue Loader webpack 5 bug * Remove purifycss support PurifyCSS webpack is no longer maintained and it’s recommended to use PurgeCSS with PostCSS instead * Fix webpack rule schema * Centralize split chunk creation * Work on CSS extraction extract-text-webpack-plugin was not really compatible witht webpack 4 but kinda worked in many cases. It will not work with webpack 5 at all. * Move CSS to proper file And there’s no extra empty(-ish) JS files! 🎉 * Handle Vue style extraction * Remove extra chunks * Update extraction handling * Temporarily remove file * Update deps Tests pass. Updating ava breaks things. :/ * Upgrade webpack * Refactor CSS chunk generation * Don’t eagerly extract all CSS Before this was extracting all CSS from every call into the same chunk. This is not what we want espcially when there are multiple preprocessor calls. * Mostly fix Vue CSS extraction * Properly extract PostCSS styles * Update tests * Update testts Have to fix the extra generated files * Fix unnecessary style extraction * Fix tests * Reset chunks for each test * Tweak chunk generation * Ensure Vue styles are always appended when requested * Fix test * Cleanup code * Fix less preprocessing * Run tests on Node 12+ * Fix npm installation on AppVeyor npm ci only works with a lockfile * Fix production builds 1. This class no longer exists and is controlled by an optimization key. 2. This is the default in production builds for webpack * Add test for previous production build fix * Fix total vendor extraction * Disable default vendor extraction Async split chunks that share modules will extract shared modules. This is a good thing but it likely doesn’t match user expectations and won’t always get placed into the appropriate folder. * Remove unused method * Make extract tests check build results * Fix extraction * Update to latest webpack 5 beta * Return promise from compile * Add integration test for js compilation * Add failing integration test for js + css compilation When this test passes we’ll know the problem has been fixed * Refactor * Add plugin to remove CSS only chunks This seems to work. Hopefully it’s not terribly broken… * Refactor * Normalize output paths when starting with the public folder name * Update browsersync plugin * Remove console log * Fix broken test * Fix pre-proceessor chunk splitting * Restore support for global vue styles This also allows global vue styles to work with any preprocessor Mix supports * Rename for consistency * Update tests * Fix public path handling on windows
- Loading branch information
1 parent
8f1a87e
commit a3a680b
Showing
53 changed files
with
1,168 additions
and
587 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,207 @@ | ||
| let instance; | ||
|
|
||
| /** @typedef {import("webpack/declarations/WebpackOptions").OptimizationSplitChunksCacheGroup} CacheGroup */ | ||
|
|
||
| /** | ||
| * @typedef {(module: import("webpack").Module, chunks: import("webpack").ChunkData[]) => bool} ChunkTestCallback | ||
| * @typedef {undefined|boolean|string|RegExp|ChunkTestCallback} ChunkTest | ||
| */ | ||
|
|
||
| /** | ||
| * @typedef {(chunk: CacheGroup, id: string) => bool} ChunkFindCallback | ||
| */ | ||
|
|
||
| class Chunks { | ||
| constructor() { | ||
| /** @type {{[key: string]: CacheGroup}} */ | ||
| this.chunks = {}; | ||
|
|
||
| this.entry = null; | ||
| this.runtime = false; | ||
| } | ||
|
|
||
| /** | ||
| * @return {Chunks} | ||
| */ | ||
| static instance() { | ||
| return instance || this.reset(); | ||
| } | ||
|
|
||
| /** | ||
| * @return {Chunks} | ||
| */ | ||
| static reset() { | ||
| return (instance = new Chunks()); | ||
| } | ||
|
|
||
| /** | ||
| * | ||
| * @param {string} id A unique identifier for this chunk. Multiple chunks with the same ID are merged. | ||
| * @param {string} path The output path for this chunk | ||
| * @param {ChunkTest|ChunkTest[]} test A test that tells webpack how to determine what to put in this chunk | ||
| * @param {Partial<CacheGroup>} attrs | ||
| */ | ||
| add(id, path, test, attrs = {}) { | ||
| this.create(id, path, attrs).addTo(id, test); | ||
| } | ||
|
|
||
| /** | ||
| * | ||
| * @param {string} id A unique identifier for this chunk. Multiple chunks with the same ID are merged. | ||
| * @param {string} path The output path for this chunk | ||
| * @param {Partial<CacheGroups>} attrs | ||
| */ | ||
| create(id, path, attrs = {}) { | ||
| this.chunks[id] = { | ||
| name: path, | ||
| ...attrs | ||
| }; | ||
|
|
||
| return this; | ||
| } | ||
|
|
||
| /** | ||
| * | ||
| * @param {string} idOrPath | ||
| * @param {ChunkTest|ChunkTest[]} test | ||
| */ | ||
| addTo(idOrPath, test) { | ||
| const chunk = this.find(idOrPath); | ||
|
|
||
| if (Array.isArray(test)) { | ||
| test = this._checkAllTests(test); | ||
| } | ||
|
|
||
| if (chunk.test) { | ||
| test = this._checkAnyTests([chunk.test, test]); | ||
| } | ||
|
|
||
| chunk.test = test; | ||
|
|
||
| return this; | ||
| } | ||
|
|
||
| /** | ||
| * | ||
| * @param {string|ChunkFindCallback} idOrPath | ||
| * @returns {CacheGroup|null} | ||
| */ | ||
| find(idOrPath) { | ||
| if (typeof idOrPath === 'string') { | ||
| if (this.chunks[idOrPath]) { | ||
| return this.chunks[idOrPath]; | ||
| } | ||
|
|
||
| return this.find((_, id) => id === idOrPath); | ||
| } | ||
|
|
||
| const item = Object.entries(this.chunks).find(([id, chunk]) => | ||
| idOrPath(chunk, id) | ||
| ); | ||
|
|
||
| return item ? item[1] : null; | ||
| } | ||
|
|
||
| config() { | ||
| return { | ||
| optimization: { | ||
| ...this.runtimeChunk(), | ||
| ...this.splitChunks() | ||
| } | ||
| }; | ||
| } | ||
|
|
||
| runtimeChunk() { | ||
| if (!this.runtime || !this.entry) { | ||
| return {}; | ||
| } | ||
|
|
||
| return { | ||
| runtimeChunk: { | ||
| name: path.join(this.entry.base, 'manifest').replace(/\\/g, '/') | ||
| } | ||
| }; | ||
| } | ||
|
|
||
| splitChunks() { | ||
| return { | ||
| splitChunks: { | ||
| ...this.cacheGroups() | ||
| } | ||
| }; | ||
| } | ||
|
|
||
| cacheGroups() { | ||
| return { | ||
| cacheGroups: { | ||
| default: false, | ||
| defaultVendors: false, | ||
| ...this.chunks | ||
| } | ||
| }; | ||
| } | ||
|
|
||
| /** | ||
| * Check to see if a chunk should be included based on multiple tests | ||
| * | ||
| * This is for internal use only and may be changed or removed at any time | ||
| * | ||
| * @internal | ||
| * | ||
| * @param {(undefined|boolean|string|RegExp|Function)[]} tests | ||
| * @param {Module} module the module | ||
| * @param {CacheGroupsContext} context context object | ||
| */ | ||
| _checkAllTests(tests) { | ||
| return (module, context) => | ||
| tests.every(test => this._checkTest(test, module, context)); | ||
| } | ||
|
|
||
| /** | ||
| * Check to see if a chunk should be included based on multiple tests | ||
| * | ||
| * This is for internal use only and may be changed or removed at any time | ||
| * | ||
| * @internal | ||
| * | ||
| * @param {(undefined|boolean|string|RegExp|Function)[]} tests | ||
| * @param {Module} module the module | ||
| * @param {CacheGroupsContext} context context object | ||
| */ | ||
| _checkAnyTests(tests) { | ||
| return (module, context) => | ||
| tests.some(test => this._checkTest(test, module, context)); | ||
| } | ||
|
|
||
| /** | ||
| * Check to see if a chunk should be included | ||
| * | ||
| * NOTE: This repeats the code from the SplitChunksPlugin checkTest function | ||
| * This is for internal use only and may be changed or removed at any time | ||
| * | ||
| * @internal | ||
| * | ||
| * @param {undefined|boolean|string|RegExp|Function} test test option | ||
| * @param {Module} module the module | ||
| * @param {CacheGroupsContext} context context object | ||
| * @returns {boolean} true, if the module should be selected | ||
| */ | ||
| _checkTest(test, module, context) { | ||
| if (test === undefined) return true; | ||
| if (typeof test === 'function') { | ||
| return test(module, context); | ||
| } | ||
| if (typeof test === 'boolean') return test; | ||
| if (typeof test === 'string') { | ||
| const name = module.nameForCondition(); | ||
| return name && name.startsWith(test); | ||
| } | ||
| if (test instanceof RegExp) { | ||
| const name = module.nameForCondition(); | ||
| return name && test.test(name); | ||
| } | ||
| return false; | ||
| } | ||
| } | ||
|
|
||
| module.exports.Chunks = Chunks; |
Oops, something went wrong.