feat: css-tree 3.1+ support which includes es module support

packages/webpack5/src/configuration/base.ts

@@ -87,6 +87,26 @@ export default function (config: Config, env: IWebpackEnv = _env): Config {
 		node: false,
 	});
 
+	// Mock Node.js built-ins that are not available in NativeScript runtime
+	// but are required by some packages like css-tree
+	config.resolve.merge({
+		fallback: {
+			module: require.resolve('../polyfills/module.js'),
+		},
+		alias: {
+			// Mock mdn-data modules that css-tree tries to load
+			'mdn-data/css/properties.json': require.resolve(
+				'../polyfills/mdn-data-properties.js',
+			),
+			'mdn-data/css/syntaxes.json': require.resolve(
+				'../polyfills/mdn-data-syntaxes.js',
+			),
+			'mdn-data/css/at-rules.json': require.resolve(
+				'../polyfills/mdn-data-at-rules.js',
+			),
+		},
+	});
+
 	const getSourceMapType = (map: string | boolean): Config.DevTool => {
 		const defaultSourceMap = 'inline-source-map';
 

packages/webpack5/src/polyfills/mdn-data-at-rules.ts

@@ -0,0 +1,8 @@
+/**
+ * Mock for mdn-data/css/at-rules.json
+ * Returns empty object since css-tree has its own comprehensive data
+ * This prevents css-tree from failing when trying to patch its data
+ */
+
+// Return empty object - css-tree will use its built-in data instead
+export = {};

packages/webpack5/src/polyfills/mdn-data-properties.ts

@@ -0,0 +1,8 @@
+/**
+ * Mock for mdn-data/css/properties.json
+ * Returns empty object since css-tree has its own comprehensive data
+ * This prevents css-tree from failing when trying to patch its data
+ */
+
+// Return empty object - css-tree will use its built-in data instead
+export = {};

packages/webpack5/src/polyfills/mdn-data-syntaxes.ts

@@ -0,0 +1,8 @@
+/**
+ * Mock for mdn-data/css/syntaxes.json
+ * Returns empty object since css-tree has its own comprehensive data
+ * This prevents css-tree from failing when trying to patch its data
+ */
+
+// Return empty object - css-tree will use its built-in data instead
+export = {};

packages/webpack5/src/polyfills/module.ts

@@ -0,0 +1,32 @@
+/**
+ * Polyfill for Node.js 'module' built-in
+ * Provides minimal implementation for NativeScript environment
+ */
+
+// Mock createRequire function that css-tree uses
+function createRequire(filename: string) {
+	// Return a mock require function
+	return function mockRequire(id: string) {
+		// Handle css-tree's internal patch.json file
+		if (id.includes('../data/patch.json') || id.includes('patch.json')) {
+			// Return css-tree's patch structure
+			return {
+				atrules: {},
+				properties: {},
+				types: {},
+			};
+		}
+
+		// For mdn-data files, return empty objects
+		if (id.includes('mdn-data')) {
+			return {};
+		}
+
+		// For any other requires, return empty object
+		return {};
+	};
+}
+
+module.exports = {
+	createRequire: createRequire,
+};