Fix: TS config file using DefineConfig in a non-type="module" project (#917)

* fix: Enforce that wmr.config.ts be transpiled to ESM

* docs: Adding changeset

* Apply suggestions from code review

Co-authored-by: Ryan Christian <[email protected]>

Co-authored-by: Jason Miller <[email protected]>

Author: rschristian

.changeset/eighty-rivers-compare.md

@@ -0,0 +1,5 @@
+---
+'wmr': patch
+---
+
+Ensures TS config file is transpiled to ESM so that it can use `defineConfig`

packages/wmr/src/lib/compile-single-module.js

@@ -30,7 +30,7 @@ let cache;
  * @param {import('rollup').ModuleFormat} [options.format]
  */
 export const compileSingleModule = withCache(
-	async (input, { out, hmr = true, rewriteNodeImports = true, format = 'es' }) => {
+	async (input, { out, filename, hmr = true, rewriteNodeImports = true, format = 'es' }) => {
 		// The TS config file should be the only one that passes through here
 		const isConfigFile = input.endsWith('wmr.config.ts');
 		input = input.replace(/\.css\.js$/, '.css');
@@ -73,7 +73,7 @@ export const compileSingleModule = withCache(
 		const result = await bundle.write({
 			...ROLLUP_FAST_OUTPUT,
 			dir: out,
-			assetFileNames: '[name].[ext]',
+			entryFileNames: filename || '[name].[ext]',
 			paths: str => str,
 			format,
 			exports: 'auto'

packages/wmr/src/lib/normalize-options.js

@@ -99,12 +99,14 @@ export async function normalizeOptions(options, mode, configWatchFiles = []) {
 			if (ext === '.ts') {
 				// Create a temporary file to write compiled output into
 				// TODO: Do this in memory
-				configFile = resolve(options.cwd, 'wmr.config.js');
+				const tmpConfig = `wmr.config.${pkg && pkg.type === 'module' ? 'js' : 'mjs'}`;
+				configFile = resolve(options.cwd, tmpConfig);
 				await compileSingleModule(file, {
 					out: resolve('.'),
+					filename: tmpConfig,
 					hmr: false,
 					rewriteNodeImports: false,
-					format: pkg && pkg.type === 'module' ? 'es' : 'commonjs'
+					format: 'es'
 				});
 			}
 

packages/wmr/test/config.test.js

@@ -26,13 +26,20 @@ describe('config', () => {
 			await waitForMessage(instance.output, /name: ["']foo["']/);
 		});
 
-		it('should support setting options via object arg (ts)', async () => {
+		it('should support setting options via object arg (ts + esm)', async () => {
 			await loadFixture('define-config-typescript', env);
 			instance = await runWmrFast(env.tmp.path);
 			await instance.address;
 			await waitForMessage(instance.output, /name: ["']foo["']/);
 		});
 
+		it('should support setting options via object arg (ts + cjs)', async () => {
+			await loadFixture('define-config-typescript-cjs', env);
+			instance = await runWmrFast(env.tmp.path);
+			await instance.address;
+			await waitForMessage(instance.output, /name: ["']foo["']/);
+		});
+
 		it('should support setting options via function', async () => {
 			await loadFixture('define-config-fn', env);
 			instance = await runWmrFast(env.tmp.path);

packages/wmr/test/fixtures/define-config-typescript-cjs/public/index.html

@@ -0,0 +1 @@
+<h1>it works</h1>

packages/wmr/test/fixtures/define-config-typescript-cjs/wmr.config.ts

@@ -0,0 +1,5 @@
+import { defineConfig } from 'wmr';
+
+export default defineConfig({
+	plugins: [{ name: 'foo' }]
+});