tsnv 0.0.0-dev.20260201114010 → 0.0.0-dev.20260203190732

package/README.md

@@ -16,7 +16,7 @@ Modern build toolkit for React Native libraries<br>
 
 - **Fast** - Powered by [Rolldown](https://rolldown.rs), a Rust-based bundler
 - **Platform-aware** - Automatic handling of platform-specific modules (`.android.ts`, `.ios.ts`, `.native.ts`)
-- **Dual format** - Supports both CommonJS and ESM output
+- **Assets** - Built-in support for assets (images, fonts, and other static files)
 - **TypeScript** - First-class TypeScript support with automatic `.d.ts` generation
 - **Zero-config** - Sensible defaults that just work
 - **Yarn PnP** - Works seamlessly with Yarn Plug'n'Play
@@ -46,7 +46,6 @@ That's it. tsnv works out of the box with sensible defaults:
 
 - Source directory: `src`
 - Output directory: `dist`
-- Format: ESM
 - TypeScript declarations: enabled
 
 ### Custom Configuration (Optional)
@@ -57,7 +56,6 @@ If you need to customize the build, create a `tsnv.config.ts`:
 import { defineConfig } from 'tsnv';
 
 export default defineConfig({
-  format: ['esm', 'cjs'],
   sourcemap: true,
 });
 ```
@@ -76,9 +74,6 @@ export default defineConfig({
   // Output directory
   outDir: 'dist',
 
-  // Output format: 'esm', 'cjs', or ['esm', 'cjs']
-  format: 'esm',
-
   // Generate TypeScript declaration files
   dts: true,
 
@@ -91,6 +86,9 @@ export default defineConfig({
   // Asset file extensions (Metro defaults)
   assetExtensions: ['bmp', 'gif', 'jpg', 'jpeg', 'png', 'psd', 'svg', 'webp' /* ... */],
 
+  // The directory where asset files will be written.
+  assetsDir: '_assets',
+
   // Files to exclude from the build
   exclude: /__(?:tests?|fixtures?|mocks?)__/,
 
@@ -115,45 +113,20 @@ export default defineConfig({
 
 ## Output Structure
 
-### ESM only (`format: 'esm'`)
-
-```
-dist/
-├── index.js
-├── greeting.android.js
-├── greeting.ios.js
-└── types/
-    ├── index.d.ts
-    └── greeting.d.ts
-```
-
-### CommonJS only (`format: 'cjs'`)
-
 ```
 dist/
+│   # JavaScript
 ├── index.js
 ├── greeting.android.js
 ├── greeting.ios.js
-└── types/
-    ├── index.d.ts
-    └── greeting.d.ts
-```
-
-### Dual format (`format: ['esm', 'cjs']`)
-
-```
-dist/
-├── esm/
-│   ├── index.js
-│   ├── greeting.android.js
-│   └── greeting.ios.js
-├── cjs/
-│   ├── index.js
-│   ├── greeting.android.js
-│   └── greeting.ios.js
-└── types/
-    ├── index.d.ts
-    └── greeting.d.ts
+│  
+│   # Types
+├── index.d.ts
+├── greeting.d.ts
+│
+│   # Assets
+└── _assets/
+      └── (files)
 ```
 
 ## License

package/dist/config.d.cts

@@ -1,9 +1,6 @@
 import { TsConfigJson } from "get-tsconfig";
 import { OutputOptions } from "rolldown";
 
-//#region src/types.d.ts
-type Format = 'esm' | 'cjs';
-//#endregion
 //#region src/config/types.d.ts
 interface Config {
   /**
@@ -22,12 +19,6 @@ interface Config {
    * Defaults to `/__(?:tests?|fixtures?|mocks?)__/`
    */
   exclude?: RegExp;
-  /**
-   * Expected format of generated code.
-   *
-   * Defaults to `'esm'`
-   */
-  format?: Format | Format[];
   /**
    * Specifiers to resolve platform specific modules.
    *
@@ -46,6 +37,12 @@ interface Config {
    * Default to following extensions: [Metro's default asset extensions](https://github.com/facebook/metro/blob/v0.83.3/packages/metro-config/src/defaults/defaults.js)
    */
   assetExtensions?: string[];
+  /**
+   * The directory where asset files will be written.
+   *
+   * Defaults to `'_assets'`
+   */
+  assetsDir?: string;
   /**
    * Enables generation of TypeScript declaration files (.d.ts).
    *

package/dist/config.d.ts

@@ -1,9 +1,6 @@
 import { TsConfigJson } from "get-tsconfig";
 import { OutputOptions } from "rolldown";
 
-//#region src/types.d.ts
-type Format = 'esm' | 'cjs';
-//#endregion
 //#region src/config/types.d.ts
 interface Config {
   /**
@@ -22,12 +19,6 @@ interface Config {
    * Defaults to `/__(?:tests?|fixtures?|mocks?)__/`
    */
   exclude?: RegExp;
-  /**
-   * Expected format of generated code.
-   *
-   * Defaults to `'esm'`
-   */
-  format?: Format | Format[];
   /**
    * Specifiers to resolve platform specific modules.
    *
@@ -46,6 +37,12 @@ interface Config {
    * Default to following extensions: [Metro's default asset extensions](https://github.com/facebook/metro/blob/v0.83.3/packages/metro-config/src/defaults/defaults.js)
    */
   assetExtensions?: string[];
+  /**
+   * The directory where asset files will be written.
+   *
+   * Defaults to `'_assets'`
+   */
+  assetsDir?: string;
   /**
    * Enables generation of TypeScript declaration files (.d.ts).
    *

package/dist/index.js

@@ -4,9 +4,9 @@ import pc from "picocolors";
 import { VERSION, build } from "rolldown";
 import { createDebug } from "obug";
 import fs, { globSync } from "node:fs";
+import path$1 from "node:path";
 import * as pkg from "empathic/package";
 import { assert } from "es-toolkit";
-import path$1 from "node:path";
 import { dts } from "rolldown-plugin-dts";
 import { promisify } from "node:util";
 import { brotliCompress, gzip } from "node:zlib";
@@ -20,7 +20,6 @@ const DEFAULT_CONFIG = {
 	source: "src",
 	outDir: "dist",
 	exclude: /__(?:tests?|fixtures?|mocks?)__/,
-	format: "esm",
 	specifiers: [
 		"android",
 		"ios",
@@ -63,29 +62,24 @@ const DEFAULT_CONFIG = {
 		"ttf",
 		"zip"
 	],
+	assetsDir: "_assets",
 	dts: true,
 	clean: true
 };
 
 //#endregion
 //#region src/context.ts
-async function resolveContext(cwd) {
+async function resolveContext(cwd, config) {
 	const packageJsonPath = pkg.up({ cwd });
 	assert(packageJsonPath, "could not find package.json");
 	const rawPackageJson = await fs.promises.readFile(packageJsonPath, "utf-8");
-	const packageJson = JSON.parse(rawPackageJson);
 	return {
 		cwd,
-		packageJson,
-		packageType: resolvePackageType(packageJson)
+		packageJson: JSON.parse(rawPackageJson),
+		outdir: path$1.resolve(cwd, config.outDir),
+		source: path$1.resolve(cwd, config.source)
 	};
 }
-function resolvePackageType(packageJson) {
-	switch (packageJson.type) {
-		case "module": return "esm";
-		default: return "cjs";
-	}
-}
 
 //#endregion
 //#region src/utils/path.ts
@@ -112,7 +106,7 @@ hasPlatformSpecificModule.cache = /* @__PURE__ */ new Map();
 * In the case of platform-specific modules, a prefix such as `android.js` or `ios.js` is added before the module name.
 * If the standard module specification, which requires the full file path to be specified, is followed, platform-specific modules cannot be found.
 *
-* Therefore, the `.js` extension is used regardless of whether the module is ESM or CJS.
+* Therefore, the `.js` extension is used.
 */
 function resolveFilename() {
 	return `[name].js`;
@@ -139,6 +133,112 @@ function getUniquePlatformSpecificFiles(files, extensions, specifiers) {
 	return result;
 }
 
+//#endregion
+//#region src/rolldown/plugins/block-require.ts
+function blockRequire() {
+	return {
+		name: "tsnv:block-require",
+		resolveId(id, importer, extraOptions) {
+			if (extraOptions.kind === "require-call") throw new Error([
+				"CommonJS require call expressions are not allowed.",
+				"Please use import statements instead.",
+				"",
+				`require('${id}') at '${importer ?? "<unknown file>"}'`
+			].join("\n"));
+		}
+	};
+}
+
+//#endregion
+//#region src/utils/asset.ts
+const assets = /* @__PURE__ */ new Map();
+function addAsset(key, value) {
+	assets.set(key, value);
+}
+function flushAssets(context) {
+	let count = 0;
+	const label = pc.yellow("[AST]");
+	for (const [key, value] of assets.entries()) {
+		const destination = path$1.join(context.outdir, value);
+		const dirname = path$1.dirname(destination);
+		const filename = path$1.basename(destination);
+		if (!fs.existsSync(dirname)) fs.mkdirSync(dirname, { recursive: true });
+		fs.copyFileSync(key, destination);
+		console.log(label, pc.dim(path$1.relative(context.cwd, dirname) + path$1.sep) + pc.yellow(filename));
+		count++;
+	}
+	console.log(label, `${count} files`);
+	assets.clear();
+}
+const SCALE_PATTERN = "@(\\d+\\.?\\d*)x";
+function collectAssets(context, assetPath) {
+	const dirname = path$1.dirname(assetPath);
+	const extension = path$1.extname(assetPath);
+	const baseName = stripAllSuffixes(context, path$1.basename(assetPath, extension));
+	const platformPattern = context.config.specifiers.map((p) => `\\.${p}`).join("|");
+	const assetRegExp = new RegExp(`^${escapeRegExp(baseName)}(${SCALE_PATTERN})?(${platformPattern})?${escapeRegExp(extension)}$`);
+	const files = fs.readdirSync(dirname, { withFileTypes: true });
+	const matchedFiles = [];
+	for (const file of files) if (file.isFile() && assetRegExp.test(file.name)) matchedFiles.push(path$1.join(dirname, file.name));
+	return {
+		baseName,
+		extension,
+		files: matchedFiles
+	};
+}
+function stripAllSuffixes(context, basename) {
+	const platformPattern = context.config.specifiers.map((p) => `\\.${p}`).join("|");
+	return basename.replace(new RegExp(`(${SCALE_PATTERN})?(${platformPattern})?$`), "");
+}
+function escapeRegExp(str) {
+	return str.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+}
+
+//#endregion
+//#region src/rolldown/plugins/collect-asset.ts
+function collectAsset(context) {
+	return {
+		name: "tsnv:collect-asset",
+		resolveId(id, importer) {
+			const extname = path$1.extname(id).slice(1);
+			if (extname) {
+				if (context.config.assetExtensions.includes(extname)) {
+					const resolveDir = importer ? path$1.dirname(importer) : context.cwd;
+					const assetPath = path$1.resolve(resolveDir, id);
+					const collectedAssets = collectAssets(context, assetPath);
+					this.debug(`Found asset: ${id} (at: ${importer ?? "<unknown>"})`);
+					let virtualDir = "";
+					for (const file of collectedAssets.files) {
+						const virtualPath = resolveVirtualAssetPath(context, file);
+						if (!virtualDir) virtualDir = path$1.dirname(virtualPath);
+						addAsset(file, virtualPath);
+					}
+					if (collectedAssets.files.length === 0) {
+						this.warn(`No assets found for ${id}`);
+						return {
+							id,
+							external: true
+						};
+					} else {
+						assert(virtualDir, "virtual asset directory not found");
+						const basename = path$1.basename(assetPath);
+						const toRootRelativePath = path$1.relative(resolveDir, context.source);
+						const virtualAssetPath = path$1.join(toRootRelativePath, virtualDir, basename);
+						return {
+							id: virtualAssetPath.startsWith(".") ? virtualAssetPath : `.${path$1.sep}${virtualAssetPath}`,
+							external: true
+						};
+					}
+				}
+			}
+		}
+	};
+}
+function resolveVirtualAssetPath(context, asset) {
+	const assetRelativePath = path$1.relative(context.cwd, asset);
+	return path$1.join(context.config.assetsDir, assetRelativePath);
+}
+
 //#endregion
 //#region src/rolldown/plugins/dts.ts
 const debug$2 = createDebug("tsnv:dts");
@@ -241,7 +341,6 @@ function report(options) {
 	const formatLabel = (() => {
 		switch (format) {
 			case "esm": return pc.blue(`[ESM]`);
-			case "cjs": return pc.yellow(`[CJS]`);
 			case "dts": return pc.green(`[DTS]`);
 		}
 	})();
@@ -275,6 +374,7 @@ function resolveBuildOptions(context, options) {
 	};
 	const baseOptions = {
 		input: options.files,
+		transform: { jsx: "react-jsx" },
 		output: {
 			banner: options.config.banner,
 			footer: options.config.footer,
@@ -282,37 +382,31 @@ function resolveBuildOptions(context, options) {
 			outro: options.config.outro,
 			sourcemap: options.config.sourcemap,
 			preserveModulesRoot: options.config.source,
-			preserveModules: true
+			cleanDir: options.config.clean,
+			preserveModules: true,
+			polyfillRequire: false
 		}
 	};
-	let formats;
-	if (Array.isArray(options.config.format)) formats = options.config.format;
-	else formats = [options.config.format];
-	const uniqueFormats = Array.from(new Set(formats));
-	const isSingleFormat = uniqueFormats.length === 1;
 	const filename = resolveFilename();
-	const resolvedBuildOptions = uniqueFormats.map((format) => {
-		return {
-			...baseOptions,
-			plugins: [external(pluginContext), report({
-				cwd: options.cwd,
-				format
-			})],
-			output: {
-				...baseOptions.output,
-				dir: isSingleFormat ? options.config.outDir : path$1.join(options.config.outDir, format),
-				cleanDir: options.config.clean,
-				format,
-				entryFileNames: filename,
-				chunkFileNames: filename
-			}
-		};
-	});
+	const resolvedBuildOptions = [{
+		...baseOptions,
+		plugins: [...getBasePlugins(pluginContext), report({
+			cwd: options.cwd,
+			format: "esm"
+		})],
+		output: {
+			...baseOptions.output,
+			format: "esm",
+			dir: options.config.outDir,
+			entryFileNames: filename,
+			chunkFileNames: filename
+		}
+	}];
 	if (options.config.dts) resolvedBuildOptions.push({
 		...baseOptions,
 		input: getUniquePlatformSpecificFiles(options.files, options.config.sourceExtensions, options.config.specifiers),
 		plugins: [
-			external(pluginContext),
+			...getBasePlugins(pluginContext),
 			report({
 				cwd: options.cwd,
 				format: "dts"
@@ -321,8 +415,8 @@ function resolveBuildOptions(context, options) {
 		],
 		output: {
 			...baseOptions.output,
-			cleanDir: options.config.clean,
-			dir: path$1.join(options.config.outDir, "types"),
+			cleanDir: false,
+			dir: options.config.outDir,
 			format: "esm",
 			entryFileNames: filename,
 			chunkFileNames: filename
@@ -330,6 +424,13 @@ function resolveBuildOptions(context, options) {
 	});
 	return resolvedBuildOptions;
 }
+function getBasePlugins(pluginContext) {
+	return [
+		blockRequire(),
+		collectAsset(pluginContext),
+		external(pluginContext)
+	];
+}
 
 //#endregion
 //#region src/rolldown/index.ts
@@ -340,9 +441,27 @@ async function build$1(context, options) {
 	for (const buildOption of buildOptions) await build(buildOption);
 }
 
+//#endregion
+//#region src/utils/log.ts
+function withBoundary(title, text) {
+	return [
+		`╭─ ${title}`,
+		...text.split("\n").map((line) => {
+			return `│ ${line}`;
+		}),
+		"╰─ ·"
+	].join("\n");
+}
+
+//#endregion
+//#region src/utils/rolldown.ts
+function getBindingErrors(reason) {
+	if (reason instanceof Error) return reason.errors;
+}
+
 //#endregion
 //#region src/index.ts
-const version = `v0.0.0-dev.20260201114010`;
+const version = `v0.0.0-dev.20260203190732`;
 async function main() {
 	console.log(`tsnv ${pc.dim(version)} powered by rolldown ${pc.dim(VERSION)}`);
 	debug$3("Loading config...");
@@ -355,7 +474,7 @@ async function main() {
 	debug$3("Config loaded", config);
 	console.log(`Config File: ${pc.underline(configFile)}`);
 	console.log(`Source Path: ${pc.blue(path.resolve(config.source))}`);
-	const context = await resolveContext(process.cwd());
+	const context = await resolveContext(cwd, config);
 	debug$3("Resolved context", context);
 	const files = await collectFiles(config);
 	console.log(`Collected files: ${pc.dim(files.length)}`);
@@ -367,13 +486,17 @@ async function main() {
 		config
 	});
 	const endedAt = performance.now();
+	flushAssets(context);
 	const duration = `${Math.floor(endedAt - startedAt)}ms`;
 	console.log(`Build completed in ${pc.green(duration)}`);
 }
 await main().catch((reason) => {
-	console.error(pc.red(`Build failed`));
-	console.error();
-	console.error(reason);
+	const errors = getBindingErrors(reason) ?? [reason];
+	console.error("");
+	errors.forEach((error, index) => {
+		console.error(withBoundary(pc.red(`Error #${index + 1}`), error.message) + "\n");
+	});
+	console.error(pc.red(`Build failed with ${errors.length} error${errors.length > 1 ? "s" : ""}`));
 	process.exit(1);
 });
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tsnv",
-  "version": "0.0.0-dev.20260201114010",
+  "version": "0.0.0-dev.20260203190732",
   "description": "Modern build toolkit for React Native libraries",
   "license": "MIT",
   "author": "Geunhyeok Lee <dev.ghlee@gmail.com>",