Merge pull request #816 from ckeditor/ck/12887-2

Fix (webpack-plugin): Restored building translation files introduced in [`v31.1.10`](https://github.com/ckeditor/ckeditor5-dev/releases/tag/v31.1.10). See ckeditor/ckeditor5#12887.
ckeditor · Nov 22, 2022 · 631769e · 631769e
2 parents bd47239 + 84cf4ea
commit 631769e
Showing 1 changed file with 56 additions and 38 deletions.
diff --git a/packages/ckeditor5-dev-webpack-plugin/lib/servetranslations.js b/packages/ckeditor5-dev-webpack-plugin/lib/servetranslations.js
@@ -9,6 +9,7 @@ const chalk = require( 'chalk' );
 const rimraf = require( 'rimraf' );
 const fs = require( 'fs' );
 const path = require( 'path' );
+const semver = require( 'semver' );
 const { RawSource, ConcatSource } = require( 'webpack-sources' );
 
 /**
@@ -91,55 +92,53 @@ module.exports = function serveTranslations( compiler, options, translationServi
 
 	// Load translation files and add a loader if the package match requirements.
 	compiler.hooks.compilation.tap( 'CKEditor5Plugin', compilation => {
-		compiler.hooks.normalModuleFactory.tap( 'CKEditor5Plugin', normalModuleFactory => {
-			normalModuleFactory.tap( 'CKEditor5Plugin', ( context, module ) => {
-				const relativePathToResource = path.relative( cwd, module.resource );
+		getCompilationHooks( compiler, compilation ).tap( 'CKEditor5Plugin', ( context, module ) => {
+			const relativePathToResource = path.relative( cwd, module.resource );
+
+			if ( relativePathToResource.match( options.sourceFilesPattern ) ) {
+				// The `TranslateSource` loader must be added as the last one in the loader's chain,
+				// after any potential TypeScript file has already been compiled.
+				module.loaders.unshift( {
+					loader: path.join( __dirname, 'translatesourceloader.js' ),
+					options: { translateSource }
+				} );
 
-				if ( relativePathToResource.match( options.sourceFilesPattern ) ) {
-					// The `TranslateSource` loader must be added as the last one in the loader's chain,
-					// after any potential TypeScript file has already been compiled.
-					module.loaders.unshift( {
-						loader: path.join( __dirname, 'translatesourceloader.js' ),
-						options: { translateSource }
-					} );
+				const pathToPackage = getPathToPackage( cwd, module.resource, options.packageNamesPattern );
 
-					const pathToPackage = getPathToPackage( cwd, module.resource, options.packageNamesPattern );
+				translationService.loadPackage( pathToPackage );
+			}
+		} );
 
-					translationService.loadPackage( pathToPackage );
-				}
+		// At the end of the compilation add assets generated from the PO files.
+		// Use `optimize-chunk-assets` instead of `emit` to emit assets before the `webpack.BannerPlugin`.
+		getChunkAssets( compilation ).tap( 'CKEditor5Plugin', chunks => {
+			const generatedAssets = translationService.getAssets( {
+				outputDirectory: options.outputDirectory,
+				compilationAssetNames: Object.keys( compilation.assets )
+					.filter( name => name.endsWith( '.js' ) )
 			} );
 
-			// At the end of the compilation add assets generated from the PO files.
-			// Use `optimize-chunk-assets` instead of `emit` to emit assets before the `webpack.BannerPlugin`.
-			getChunkAssets( compilation ).tap( 'CKEditor5Plugin', chunks => {
-				const generatedAssets = translationService.getAssets( {
-					outputDirectory: options.outputDirectory,
-					compilationAssetNames: Object.keys( compilation.assets )
-						.filter( name => name.endsWith( '.js' ) )
-				} );
+			const allFiles = getFilesFromChunks( chunks );
 
-				const allFiles = getFilesFromChunks( chunks );
+			for ( const asset of generatedAssets ) {
+				if ( asset.shouldConcat ) {
+					// Concatenate sources to not break the file's sourcemap.
+					const originalAsset = compilation.assets[ asset.outputPath ];
 
-				for ( const asset of generatedAssets ) {
-					if ( asset.shouldConcat ) {
-						// Concatenate sources to not break the file's sourcemap.
-						const originalAsset = compilation.assets[ asset.outputPath ];
+					compilation.assets[ asset.outputPath ] = new ConcatSource( asset.outputBody, '\n', originalAsset );
+				} else {
+					const chunkExists = allFiles.includes( asset.outputPath );
 
-						compilation.assets[ asset.outputPath ] = new ConcatSource( asset.outputBody, '\n', originalAsset );
+					if ( !chunkExists ) {
+						// Assign `RawSource` when the corresponding chunk does not exist.
+						compilation.assets[ asset.outputPath ] = new RawSource( asset.outputBody );
 					} else {
-						const chunkExists = allFiles.includes( asset.outputPath );
-
-						if ( !chunkExists ) {
-							// Assign `RawSource` when the corresponding chunk does not exist.
-							compilation.assets[ asset.outputPath ] = new RawSource( asset.outputBody );
-						} else {
-							// Assign a string when the corresponding chunk exists and maintains the proper sourcemap.
-							// Changing it to RawSource would break sourcemaps.
-							compilation.assets[ asset.outputPath ] = asset.outputBody;
-						}
+						// Assign a string when the corresponding chunk exists and maintains the proper sourcemap.
+						// Changing it to RawSource would break sourcemaps.
+						compilation.assets[ asset.outputPath ] = asset.outputBody;
 					}
 				}
-			} );
+			}
 		} );
 	} );
 
@@ -194,6 +193,25 @@ function getPathToPackage( cwd, resource, packageNamePattern ) {
 	return relativePathToResource.slice( 0, index );
 }
 
+/**
+ * Returns an object with the compilation hooks depending on the Webpack version.
+ *
+ * @param {webpack.Compiler} compiler
+ * @param {webpack.Compilation} compilation
+ * @returns {Object}
+ */
+function getCompilationHooks( compiler, compilation ) {
+	const { webpack } = compiler;
+
+	if ( semver.major( webpack.version ) === 4 ) {
+		return compilation.hooks.normalModuleLoader;
+	}
+
+	// Do not import the `NormalModule` class directly. Find it in the current instance of webpack process.
+	// See: https://github.com/ckeditor/ckeditor5/issues/12887.
+	return webpack.NormalModule.getCompilationHooks( compilation ).loader;
+}
+
 /**
  * Returns an object with the chunk assets depending on the Webpack version.
  *