@wordpress/build 0.5.1-next.06ee73755.0 → 0.5.1-next.ba3aee3a2.0

package/lib/build.mjs

@@ -17,7 +17,6 @@ import rtlcss from 'rtlcss';
 import cssnano from 'cssnano';
 import babel from 'esbuild-plugin-babel';
 import { camelCase } from 'change-case';
-import { NodePackageImporter } from 'sass-embedded';
 
 /**
  * Internal dependencies
@@ -108,59 +107,26 @@ const wordpressExternalsPlugin = createWordpressExternalsPlugin(
 	HANDLE_PREFIX
 );
 
-/**
- * Get SASS options for the given working directory.
- *
- * Uses NodePackageImporter from sass-embedded for resolving package imports
- * (like @wordpress/base-styles) which works with any package manager (npm, pnpm, yarn).
- *
- * @param {string} workingDir - The directory where we're working (for NodePackageImporter).
- * @return {Object} SASS options object with importers and loadPaths.
- */
-function getSassOptions( workingDir ) {
-	return {
-		importers: [ new NodePackageImporter( workingDir ) ],
-		// loadPaths for resolving @wordpress/base-styles imports and local base-styles imports
-		loadPaths: [
-			// Package's own node_modules (for pnpm isolated deps)
-			path.join( workingDir, 'node_modules' ),
-			// Root node_modules (for npm hoisted deps)
-			path.join( ROOT_DIR, 'node_modules' ),
-			// For local imports like @use "mixins"
-			path.join( PACKAGES_DIR, 'base-styles' ),
-		],
-	};
-}
-
-/**
- * Create style bundling plugins with the given working directory.
- *
- * @param {string} workingDir - The directory where we're working (for NodePackageImporter).
- * @return {object[]} Array of esbuild plugins for handling CSS/SCSS.
- */
-function createStyleBundlingPlugins( workingDir ) {
-	const sassOptions = getSassOptions( workingDir );
-	return [
-		// Handle CSS modules (.module.css and .module.scss)
-		sassPlugin( {
-			embedded: true,
-			filter: /\.module\.(css|scss)$/,
-			transform: postcssModules( {
-				generateScopedName: '[name]__[local]__[hash:base64:5]',
-			} ),
-			type: 'style',
-			...sassOptions,
-		} ),
-		// Handle regular CSS/SCSS files
-		// Note: .module.css and .module.scss already handled by plugin above
-		sassPlugin( {
-			embedded: true,
-			filter: /\.(css|scss)$/,
-			type: 'style',
-			...sassOptions,
+const styleBundlingPlugins = [
+	// Handle CSS modules (.module.css and .module.scss)
+	sassPlugin( {
+		embedded: true,
+		filter: /\.module\.(css|scss)$/,
+		transform: postcssModules( {
+			generateScopedName: '[name]__[local]__[hash:base64:5]',
 		} ),
-	];
-}
+		type: 'style',
+		loadPaths: [ 'node_modules', path.join( PACKAGES_DIR, 'base-styles' ) ],
+	} ),
+	// Handle regular CSS/SCSS files
+	// Note: .module.css and .module.scss already handled by plugin above
+	sassPlugin( {
+		embedded: true,
+		filter: /\.(css|scss)$/,
+		type: 'style',
+		loadPaths: [ 'node_modules', path.join( PACKAGES_DIR, 'base-styles' ) ],
+	} ),
+];
 
 /**
  * Normalize path separators for cross-platform compatibility.
@@ -233,12 +199,16 @@ function momentTimezoneAliasPlugin() {
 
 			// Cached paths - resolved lazily on first use
 			let preBuiltBundlePath;
+			let momentTimezoneUtilsPath;
 			const resolvePaths = () => {
 				if ( preBuiltBundlePath ) {
 					return;
 				}
 				preBuiltBundlePath = require.resolve(
-					'moment-timezone/builds/moment-timezone-with-data-1970-2030.js'
+					'moment-timezone/builds/moment-timezone-with-data-1970-2030'
+				);
+				momentTimezoneUtilsPath = require.resolve(
+					'moment-timezone/moment-timezone-utils.js'
 				);
 			};
 
@@ -251,6 +221,17 @@ function momentTimezoneAliasPlugin() {
 				}
 			);
 
+			// For utils, we need to load it but ensure it works with the pre-built bundle.
+			// The utils file tries to require('./') which would load index.js.
+			// We need to make sure it gets the pre-built bundle instead.
+			build.onResolve(
+				{ filter: /^moment-timezone\/moment-timezone-utils$/ },
+				() => {
+					resolvePaths();
+					return { path: momentTimezoneUtilsPath };
+				}
+			);
+
 			// Intercept the require('./') call inside moment-timezone-utils
 			// and redirect it to the pre-built bundle.
 			build.onResolve( { filter: /^\.\/$/ }, ( args ) => {
@@ -1111,7 +1092,7 @@ async function transpilePackage( packageName ) {
 	const plugins = [
 		needsEmotionPlugin && emotionPlugin,
 		externalizeAllExceptCssPlugin,
-		...createStyleBundlingPlugins( packageDir ),
+		...styleBundlingPlugins,
 	].filter( Boolean );
 
 	if ( packageJson.main ) {
@@ -1245,7 +1226,10 @@ async function compileStyles( packageName ) {
 				plugins: [
 					sassPlugin( {
 						embedded: true,
-						...getSassOptions( packageDir ),
+						loadPaths: [
+							'node_modules',
+							path.join( PACKAGES_DIR, 'base-styles' ),
+						],
 						async transform( source ) {
 							// Process with autoprefixer for LTR version
 							const ltrResult = await postcss( [
@@ -1430,7 +1414,7 @@ async function buildRoute( routeName ) {
 						[],
 						true // Generate asset file for minified build
 					),
-					...createStyleBundlingPlugins( routeDir ),
+					...styleBundlingPlugins,
 				],
 			} ),
 			esbuild.build( {
@@ -1448,7 +1432,7 @@ async function buildRoute( routeName ) {
 						[],
 						false // Skip asset file for non-minified build
 					),
-					...createStyleBundlingPlugins( routeDir ),
+					...styleBundlingPlugins,
 				],
 			} ),
 		] );

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/build",
-	"version": "0.5.1-next.06ee73755.0",
+	"version": "0.5.1-next.ba3aee3a2.0",
 	"description": "Build tool for WordPress plugins.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -48,8 +48,7 @@
 		"moment-timezone": "^0.5.40",
 		"postcss": "8.4.38",
 		"postcss-modules": "6.0.1",
-		"rtlcss": "4.3.0",
-		"sass-embedded": "^1.97.2"
+		"rtlcss": "4.3.0"
 	},
 	"devDependencies": {
 		"@types/node": "^20.17.10"
@@ -77,5 +76,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "fd315436f44683a993d5f053789b5279d95b2872"
+	"gitHead": "67d2e486fcd40c753591cf911ca0659132f519ca"
 }