[feat] merge packaging exports (#2327)

.changeset/stale-geckos-call.md

@@ -0,0 +1,5 @@
+---
+'@sveltejs/kit': patch
+---
+
+packaging merge exports field by default

documentation/docs/14-configuration.md

@@ -34,7 +34,7 @@ const config = {
 			emitTypes: true,
 			exports: {
 				include: ['**'],
-				exclude: ['_*', '**/_*']
+				exclude: ['**/_*']
 			},
 			files: {
 				include: ['**'],
@@ -131,9 +131,9 @@ Whether to [hydrate](#ssr-and-javascript-hydrate) the server-rendered HTML with
 Options related to [creating a package](#packaging).
 
 - `dir` - output directory
-- `emitTypes` - by default, `svelte-kit package` will automatically generate types for your package in the form of `d.ts.` files. While generating types is configurable, we believe it is best for the ecosystem quality to generate types, always. Please make sure you have a good reason when setting it to `false` (for example when you want to provide handwritten type definitions instead).
-- `exports` - contains a `includes` and a `excludes` array which specifies which files to mark as exported from the `exports` field of the `package.json`
-- `files` - contains a `includes` and a `excludes` array which specifies which files to process and copy over when packaging
+- `emitTypes` - by default, `svelte-kit package` will automatically generate types for your package in the form of `d.ts.` files. While generating types is configurable, we believe it is best for the ecosystem quality to generate types, always. Please make sure you have a good reason when setting it to `false` (for example when you want to provide handwritten type definitions instead)
+- `exports` - contains an `includes` and an `excludes` array which specifies which files to mark as exported from the `exports` field of the `package.json`. Will merge existing values if available with values from `package.json` taking precedence
+- `files` - contains an `includes` and an `excludes` array which specifies which files to process and copy over when packaging
 
 ### paths
 

packages/kit/src/core/config/index.spec.js

@@ -31,7 +31,7 @@ test('fills in defaults', () => {
 				dir: 'package',
 				exports: {
 					include: ['**'],
-					exclude: ['_*', '**/_*']
+					exclude: ['**/_*']
 				},
 				files: {
 					include: ['**'],
@@ -141,7 +141,7 @@ test('fills in partial blanks', () => {
 				dir: 'package',
 				exports: {
 					include: ['**'],
-					exclude: ['_*', '**/_*']
+					exclude: ['**/_*']
 				},
 				files: {
 					include: ['**'],

packages/kit/src/core/config/options.js

@@ -92,7 +92,7 @@ const options = {
 						type: 'branch',
 						children: {
 							include: expect_array_of_strings(['**']),
-							exclude: expect_array_of_strings(['_*', '**/_*'])
+							exclude: expect_array_of_strings(['**/_*'])
 						}
 					},
 					files: {

packages/kit/src/core/config/test/index.js

@@ -41,7 +41,7 @@ async function testLoadDefaultConfig(path) {
 				dir: 'package',
 				exports: {
 					include: ['**'],
-					exclude: ['_*', '**/_*']
+					exclude: ['**/_*']
 				},
 				files: {
 					include: ['**'],

packages/kit/src/packaging/index.js

@@ -30,14 +30,10 @@ export async function make_package(config, cwd = process.cwd()) {
 	const pkg = JSON.parse(fs.readFileSync(path.join(cwd, 'package.json'), 'utf8'));
 
 	delete pkg.scripts;
-	pkg.type = 'module'; // type must be 'module'
+	pkg.type = 'module';
 
-	const user_defined_exports = 'exports' in pkg;
-
-	// We still want to always predefine some exports
-	// like package.json that is used by other packages
-	if (!pkg.exports) pkg.exports = {};
-	pkg.exports['./package.json'] = './package.json';
+	/** @type {Record<string, string>} */
+	const generated = { './package.json': './package.json' };
 
 	for (const file of files) {
 		const ext = path.extname(file);
@@ -86,19 +82,14 @@ export async function make_package(config, cwd = process.cwd()) {
 
 		write(path.join(cwd, config.kit.package.dir, out_file), out_contents);
 
-		if (!user_defined_exports && exports_filter(file)) {
+		if (exports_filter(file)) {
 			const entry = `./${out_file.replace(/\\/g, '/')}`;
 			const key = entry.endsWith('/index.js') ? entry.slice(0, -'/index.js'.length) : entry;
-			pkg.exports[key] = entry;
+			generated[key] = entry;
 		}
 	}
 
-	const main = pkg.exports['./index.js'] || pkg.exports['./index.svelte'];
-
-	if (!user_defined_exports && main) {
-		pkg.exports['.'] = main;
-	}
-
+	pkg.exports = { ...generated, ...pkg.exports };
 	write(path.join(cwd, config.kit.package.dir, 'package.json'), JSON.stringify(pkg, null, '  '));
 
 	const whitelist = fs.readdirSync(cwd).filter((file) => {

packages/kit/src/packaging/test/fixtures/exports-merge/expected/Test.svelte

@@ -0,0 +1,12 @@
+<script>
+    import { createEventDispatcher } from 'svelte';
+    /**
+     * @type {string}
+     */
+    export const astring;
+
+    const dispatch = createEventDispatcher();
+    dispatch('event', true);
+</script>
+
+<slot {astring} />

packages/kit/src/packaging/test/fixtures/exports-merge/expected/Test.svelte.d.ts

@@ -0,0 +1,40 @@
+/** @typedef {typeof __propDef.props}  TestProps */
+/** @typedef {typeof __propDef.events}  TestEvents */
+/** @typedef {typeof __propDef.slots}  TestSlots */
+export default class Test extends SvelteComponentTyped<
+	{
+		astring: string;
+	},
+	{
+		event: CustomEvent<any>;
+	} & {
+		[evt: string]: CustomEvent<any>;
+	},
+	{
+		default: {
+			astring: string;
+		};
+	}
+> {
+	get astring(): string;
+}
+export type TestProps = typeof __propDef.props;
+export type TestEvents = typeof __propDef.events;
+export type TestSlots = typeof __propDef.slots;
+import { SvelteComponentTyped } from 'svelte';
+declare const __propDef: {
+	props: {
+		astring: string;
+	};
+	events: {
+		event: CustomEvent<any>;
+	} & {
+		[evt: string]: CustomEvent<any>;
+	};
+	slots: {
+		default: {
+			astring: string;
+		};
+	};
+};
+export {};

packages/kit/src/packaging/test/fixtures/exports-merge/expected/index.d.ts

@@ -0,0 +1 @@
+export { default as Test } from './Test.svelte';

packages/kit/src/packaging/test/fixtures/exports-merge/expected/index.js

@@ -0,0 +1 @@
+export { default as Test } from './Test.svelte';

packages/kit/src/packaging/test/fixtures/exports-merge/expected/internal/Test.svelte

@@ -0,0 +1,6 @@
+<script>
+    /**
+     * @type {import('./foo').Foo}
+     */
+    export let foo;
+</script>

packages/kit/src/packaging/test/fixtures/exports-merge/expected/internal/Test.svelte.d.ts

@@ -0,0 +1,26 @@
+/** @typedef {typeof __propDef.props}  TestProps */
+/** @typedef {typeof __propDef.events}  TestEvents */
+/** @typedef {typeof __propDef.slots}  TestSlots */
+export default class Test extends SvelteComponentTyped<
+	{
+		foo: boolean;
+	},
+	{
+		[evt: string]: CustomEvent<any>;
+	},
+	{}
+> {}
+export type TestProps = typeof __propDef.props;
+export type TestEvents = typeof __propDef.events;
+export type TestSlots = typeof __propDef.slots;
+import { SvelteComponentTyped } from 'svelte';
+declare const __propDef: {
+	props: {
+		foo: import('./foo').Foo;
+	};
+	events: {
+		[evt: string]: CustomEvent<any>;
+	};
+	slots: {};
+};
+export {};

packages/kit/src/packaging/test/fixtures/exports-merge/expected/internal/_Private.svelte

@@ -0,0 +1 @@
+This is a private component and should be excluded

packages/kit/src/packaging/test/fixtures/exports-merge/expected/internal/_Private.svelte.d.ts

@@ -0,0 +1,15 @@
+/** @typedef {typeof __propDef.props}  PrivateProps */
+/** @typedef {typeof __propDef.events}  PrivateEvents */
+/** @typedef {typeof __propDef.slots}  PrivateSlots */
+export default class Private {}
+export type PrivateProps = typeof __propDef.props;
+export type PrivateEvents = typeof __propDef.events;
+export type PrivateSlots = typeof __propDef.slots;
+declare const __propDef: {
+	props: {};
+	events: {
+		[evt: string]: CustomEvent<any>;
+	};
+	slots: {};
+};
+export {};

packages/kit/src/packaging/test/fixtures/exports-merge/expected/internal/foo.d.ts

@@ -0,0 +1 @@
+export type Foo = boolean;

packages/kit/src/packaging/test/fixtures/exports-merge/expected/package.json

@@ -0,0 +1,17 @@
+{
+	"name": "exports-replace",
+	"version": "1.0.0",
+	"description": "merges exports field",
+	"exports": {
+		"./internal/constants.js": "./internal/constants.js",
+		"./internal/Test.svelte": "./internal/Test.svelte",
+		"./Test.svelte": "./Test.svelte",
+		".": {
+			"import": "./index.js"
+		},
+		"./constants": "./internal/constants.js",
+		"./Test": "./Test.svelte",
+		"./package.json": "./package.json"
+	},
+	"type": "module"
+}

packages/kit/src/packaging/test/fixtures/exports-merge/jsconfig.json

@@ -0,0 +1,10 @@
+{
+	"compilerOptions": {
+		"checkJs": true,
+		"baseUrl": ".",
+		"paths": {
+			"$lib/*": ["src/lib/*"]
+		}
+	},
+	"include": ["src/**/*.d.ts", "src/**/*.js", "src/**/*.svelte"]
+}

packages/kit/src/packaging/test/fixtures/exports-merge/package.json

@@ -0,0 +1,12 @@
+{
+	"name": "exports-replace",
+	"version": "1.0.0",
+	"description": "merges exports field",
+	"exports": {
+		".": {
+			"import": "./index.js"
+		},
+		"./constants": "./internal/constants.js",
+		"./Test": "./Test.svelte"
+	}
+}

packages/kit/src/packaging/test/fixtures/exports-merge/src/app.html

@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="utf-8" />
+		<link rel="icon" href="/favicon.ico" />
+		<meta name="viewport" content="width=device-width, initial-scale=1" />
+		%svelte.head%
+	</head>
+	<body>
+		<div id="svelte">%svelte.body%</div>
+	</body>
+</html>

packages/kit/src/packaging/test/fixtures/exports-merge/src/lib/Test.svelte

@@ -0,0 +1,12 @@
+<script>
+    import { createEventDispatcher } from 'svelte';
+    /**
+     * @type {string}
+     */
+    export const astring;
+
+    const dispatch = createEventDispatcher();
+    dispatch('event', true);
+</script>
+
+<slot {astring} />

packages/kit/src/packaging/test/fixtures/exports-merge/src/lib/index.js

@@ -0,0 +1 @@
+export { default as Test } from './Test.svelte';

packages/kit/src/packaging/test/fixtures/exports-merge/src/lib/internal/Test.svelte

@@ -0,0 +1,6 @@
+<script>
+    /**
+     * @type {import('./foo').Foo}
+     */
+    export let foo;
+</script>

packages/kit/src/packaging/test/fixtures/exports-merge/src/lib/internal/_Private.svelte

@@ -0,0 +1 @@
+This is a private component and should be excluded

packages/kit/src/packaging/test/fixtures/exports-merge/src/lib/internal/foo.d.ts

@@ -0,0 +1 @@
+export type Foo = boolean;

packages/kit/src/packaging/test/fixtures/exports-replace/expected/package.json

@@ -1,12 +1,12 @@
 {
 	"name": "exports-replace",
 	"version": "1.0.0",
-	"description": "default exports settings",
+	"description": "replaces exports field",
+	"type": "module",
 	"exports": {
 		".": {
 			"import": "./index.js"
 		},
 		"./package.json": "./package.json"
-	},
-	"type": "module"
+	}
 }

packages/kit/src/packaging/test/fixtures/exports-replace/package.json

@@ -1,7 +1,8 @@
 {
 	"name": "exports-replace",
 	"version": "1.0.0",
-	"description": "default exports settings",
+	"description": "replaces exports field",
+	"type": "module",
 	"exports": {
 		".": {
 			"import": "./index.js"

packages/kit/src/packaging/test/fixtures/exports-replace/svelte.config.js

@@ -0,0 +1,12 @@
+/** @type {import('@sveltejs/kit').Config} */
+const config = {
+	kit: {
+		package: {
+			exports: {
+				exclude: ['**']
+			}
+		}
+	}
+};
+
+export default config;

packages/kit/src/packaging/test/index.js

@@ -79,7 +79,11 @@ test('create package with emitTypes settings disabled', async () => {
 	await test_make_package('emitTypes-false');
 });
 
-test('create package with default exports settings (replace)', async () => {
+test('create package and properly merge exports map', async () => {
+	await test_make_package('exports-merge');
+});
+
+test('create package and properly exclude all exports', async () => {
 	await test_make_package('exports-replace');
 });