Merge branch 'master' into empty-render

.changeset/curvy-eggs-eat.md

@@ -0,0 +1,5 @@
+---
+"preact-cli": patch
+---
+
+fix: await copying of files in create command

.changeset/famous-dolls-leave.md

@@ -0,0 +1,5 @@
+---
+"preact-cli": patch
+---
+
+fix: allow an async component to return null rendering

.changeset/green-pugs-design.md

@@ -0,0 +1,5 @@
+---
+"preact-cli": patch
+---
+
+chore: remove preact-compat as it's unused

.github/dependabot.yml

@@ -3,7 +3,7 @@
 
 version: 2
 updates:
-  - package-ecosystem: "npm"
-    directory: "/"
+  - package-ecosystem: 'npm'
+    directory: '/'
     schedule:
-      interval: "daily"
+      interval: 'daily'

.prettierrc.json

@@ -1,4 +1,5 @@
 {
+	"arrowParens": "avoid",
 	"trailingComma": "es5",
 	"tabWidth": 2,
 	"semi": true,

package.json

@@ -17,16 +17,16 @@
     "@changesets/changelog-github": "^0.2.7",
     "@changesets/cli": "^2.10.2",
     "babel-eslint": "^10.0.1",
-    "eslint": "^7.1.0",
-    "eslint-config-prettier": "^6.0.0",
+    "eslint": "^7.12.1",
+    "eslint-config-prettier": "^6.15.0",
     "eslint-plugin-babel": "^5.3.0",
     "eslint-plugin-prettier": "^3.1.0",
-    "eslint-plugin-react": "^7.14.3",
-    "husky": "^4.2.3",
+    "eslint-plugin-react": "^7.21.5",
+    "husky": "^4.3.0",
     "lerna": "^3.16.4",
-    "lint-staged": "^10.0.7",
+    "lint-staged": "^10.5.0",
     "ncp": "^2.0.0",
-    "prettier": "^2.0.2",
+    "prettier": "^2.1.2",
     "rimraf": "^3.0.2"
   },
   "husky": {

packages/async-loader/async-legacy.js

@@ -1,6 +1,6 @@
 import { h, Component } from 'preact';
 
-export default function(req) {
+export default function (req) {
 	function Async() {
 		Component.call(this);
 

packages/async-loader/async.js

@@ -14,9 +14,9 @@ function getPreviousSibling(vnode, inner) {
 		// only search previous children
 		let end = children.indexOf(vnode);
 		if (end === -1) end = children.length;
-		for (let i=end; i--; ) {
+		for (let i = end; i--; ) {
 			const child = children[i];
-			const dom = child && child.__e || getPreviousSibling(child, true);
+			const dom = (child && child.__e) || getPreviousSibling(child, true);
 			if (dom) return dom;
 		}
 	}
@@ -31,7 +31,7 @@ export default function async(load) {
 
 		if (!component) {
 			this.componentWillMount = () => {
-				load((mod) => {
+				load(mod => {
 					component = (mod && mod.default) || mod;
 					this.setState({});
 				});
@@ -40,20 +40,20 @@ export default function async(load) {
 			this.shouldComponentUpdate = () => component != null;
 		}
 
-		this.render = (props) => {
+		this.render = props => {
 			if (component) {
 				return h(component, props);
 			}
 
 			const prev = getPreviousSibling(this.__v);
-			const me = prev && prev.nextSibling || (this.__P || this._parentDom).firstChild;
+			const me =
+				(prev && prev.nextSibling) || (this.__P || this._parentDom).firstChild;
 
-			return (
-				me &&
-				h(me.localName, {
-					dangerouslySetInnerHTML: PENDING,
-				})
-			);
+			if (!me) return;
+			if (me.nodeType === 3) return me.data;
+			return h(me.localName, {
+				dangerouslySetInnerHTML: PENDING,
+			});
 		};
 	}
 

packages/async-loader/legacy.js

@@ -3,6 +3,6 @@ const { info } = require('./utils');
 
 info('Detected Preact 8, Loading legacy async-component');
 
-exports.pitch = function(req) {
+exports.pitch = function (req) {
 	return pitch(req, PREACT_LEGACY_MODE);
 };

packages/async-loader/utils.js

@@ -1,6 +1,6 @@
 const { blue } = require('kleur');
 
-exports.info = function(text, code) {
+exports.info = function (text, code) {
 	process.stderr.write('\n' + blue('ℹ INFO: ⚛️ ') + text + '\n');
 	code && process.exit(code);
 };

packages/cli/CHANGELOG.md

@@ -1,12 +1,9 @@
 # preact-cli
 
 ## 3.0.2
-### Patch Changes
-
 
+### Patch Changes
 
 - [`07c9a9c`](https://github.com/preactjs/preact-cli/commit/07c9a9c87081d38ecb1729f57091f3984d454428) [#1413](https://github.com/preactjs/preact-cli/pull/1413) Thanks [@JoviDeCroock](https://github.com/JoviDeCroock)! - patch cleanFilename to also fix typescript and jsx files
 
-
-
 - [`ff79f0b`](https://github.com/preactjs/preact-cli/commit/ff79f0b2f6f0f8877001d075947274306884cf89) [#1406](https://github.com/preactjs/preact-cli/pull/1406) Thanks [@ForsakenHarmony](https://github.com/ForsakenHarmony)! - Fix the prefresh integration, using `--refresh` should now correctly enable fast-refresh

packages/cli/babel/index.js

@@ -25,7 +25,7 @@ module.exports = function preactCli(ctx, userOptions = {}) {
 	};
 
 	// user specified options always the strongest
-	Object.keys(presetOptions).forEach(function(key) {
+	Object.keys(presetOptions).forEach(function (key) {
 		presetOptions[key] = userOptions[key] || presetOptions[key];
 	});
 

packages/cli/lib/commands/build.js

@@ -6,7 +6,7 @@ const runWebpack = require('../lib/webpack/run-webpack');
 
 const toBool = val => val === void 0 || (val === 'false' ? false : val);
 
-module.exports = async function(src, argv) {
+module.exports = async function (src, argv) {
 	argv.src = src || argv.src;
 	// add `default:true`s, `--no-*` disables
 	argv.prerender = toBool(argv.prerender);

packages/cli/lib/commands/create.js

@@ -163,7 +163,7 @@ async function copyFileToDestination(srcPath, destPath, force = false) {
 	}
 }
 
-module.exports = async function(repo, dest, argv) {
+module.exports = async function (repo, dest, argv) {
 	// Prompt if incomplete data
 	if (!repo || !dest) {
 		const templates = await fetchTemplates();
@@ -345,12 +345,12 @@ module.exports = async function(repo, dest, argv) {
 		join('..', 'resources', 'template.html')
 	);
 	const templateDest = join(sourceDirectory, 'template.html');
-	copyFileToDestination(templateSrc, templateDest);
+	await copyFileToDestination(templateSrc, templateDest);
 
 	// Copy over sw.js
 	const serviceWorkerSrc = resolve(__dirname, join('..', '..', 'sw', 'sw.js'));
 	const serviceWorkerDest = join(sourceDirectory, 'sw.js');
-	copyFileToDestination(serviceWorkerSrc, serviceWorkerDest);
+	await copyFileToDestination(serviceWorkerSrc, serviceWorkerDest);
 
 	if (argv.install) {
 		spinner.text = 'Installing dependencies:\n';

packages/cli/lib/commands/list.js

@@ -4,7 +4,7 @@ const { error, info } = require('../util');
 
 const REPOS_URL = 'https://api.github.com/users/preactjs-templates/repos';
 
-module.exports = async function() {
+module.exports = async function () {
 	try {
 		const repos = await fetch(REPOS_URL).then(r => r.json());
 

packages/cli/lib/index.js

@@ -24,7 +24,7 @@ const commands = require('./commands');
 // installHooks();
 notifier({ pkg }).notify();
 
-process.on('unhandledRejection', (err) => {
+process.on('unhandledRejection', err => {
 	error(err.stack || err.message);
 });
 
@@ -125,7 +125,7 @@ prog
 				],
 				npmGlobalPackages: ['preact-cli'],
 			})
-			.then((info) => process.stdout.write(`${info}\n`));
+			.then(info => process.stdout.write(`${info}\n`));
 	});
 
 prog.parse(process.argv);

packages/cli/lib/lib/entry.js

@@ -3,9 +3,9 @@
 import * as Preact from 'preact';
 const { h, render, hydrate } = Preact;
 
-const interopDefault = (m) => (m && m.default ? m.default : m);
+const interopDefault = m => (m && m.default ? m.default : m);
 
-const normalizeURL = (url) => (url[url.length - 1] === '/' ? url : url + '/');
+const normalizeURL = url => (url[url.length - 1] === '/' ? url : url + '/');
 
 if (process.env.NODE_ENV === 'development') {
 	// enable preact devtools

packages/cli/lib/lib/logo.js

@@ -17,7 +17,7 @@ const color = (color, text) =>
 
 const PURPLE = 35;
 
-module.exports = function(text, useColor = true) {
+module.exports = function (text, useColor = true) {
 	let logo = LOGO;
 
 	if (text) {

packages/cli/lib/lib/output-hooks.js

@@ -31,7 +31,7 @@ function invokeHooks(text) {
 	return text;
 }
 
-module.exports = function() {
+module.exports = function () {
 	let out = wrap(process.stdout, invokeHooks),
 		err = wrap(process.stderr, invokeHooks);
 	return () => {

packages/cli/lib/lib/setup.js

@@ -3,12 +3,12 @@ const { hasCommand, warn } = require('../util');
 
 const stdio = 'ignore';
 
-exports.install = function(cwd, isYarn) {
+exports.install = function (cwd, isYarn) {
 	let cmd = isYarn ? 'yarn' : 'npm';
 	return spawn(cmd, ['install'], { cwd, stdio: 'inherit' });
 };
 
-exports.addScripts = async function(obj, cwd, isYarn) {
+exports.addScripts = async function (obj, cwd, isYarn) {
 	let cmd = isYarn ? 'yarn' : 'npm';
 	let args = isYarn ? ['add', '--dev'] : ['install', '--save-dev'];
 
@@ -25,7 +25,7 @@ exports.addScripts = async function(obj, cwd, isYarn) {
 
 // Initializes the folder using `git init` and a proper `.gitignore` file
 // if `git` is present in the $PATH.
-exports.initGit = async function(target) {
+exports.initGit = async function (target) {
 	let git = hasCommand('git');
 
 	if (git) {

packages/cli/lib/lib/webpack/dummy-loader.js

@@ -1,3 +1,3 @@
-module.exports = function(source, map) {
+module.exports = function (source, map) {
 	this.callback(null, source, map);
 };

packages/cli/lib/lib/webpack/prerender.js

@@ -5,7 +5,7 @@ const stackTrace = require('stack-trace');
 const URL = require('url');
 const { SourceMapConsumer } = require('source-map');
 
-module.exports = function(env, params) {
+module.exports = function (env, params) {
 	params = params || {};
 
 	let entry = resolve(env.dest, './ssr-build/ssr-bundle.js');
@@ -61,7 +61,7 @@ async function handlePrerenderError(err, env, stack, entry) {
 				column: stack.getColumnNumber(),
 			});
 		});
-		
+
 		if (position.source) {
 			position.source = position.source
 				.replace('webpack://', '.')

packages/cli/lib/lib/webpack/render-html-plugin.js

@@ -63,7 +63,7 @@ module.exports = async function (config) {
 			: resolve(dest, url.substring(1), 'index.html');
 		return Object.assign(values, {
 			filename,
-			template: `!!ejs-loader!${template}`,
+			template: `!!ejs-loader?esModule=false!${template}`,
 			minify: isProd && {
 				collapseWhitespace: true,
 				removeScriptTypeAttributes: true,

packages/cli/lib/lib/webpack/run-webpack.js

@@ -29,7 +29,7 @@ async function devBuild(env) {
 			// ...tell webpack to watch node_modules recursively until they appear.
 			if (
 				Array.from(missingDeps).some(
-					(file) => file.indexOf(nodeModulesPath) !== -1
+					file => file.indexOf(nodeModulesPath) !== -1
 				)
 			) {
 				compilation.contextDependencies.push(nodeModulesPath);
@@ -38,7 +38,7 @@ async function devBuild(env) {
 			callback();
 		});
 
-		compiler.hooks.done.tap('CliDevPlugin', (stats) => {
+		compiler.hooks.done.tap('CliDevPlugin', stats => {
 			let devServer = config.devServer;
 			let protocol = process.env.HTTPS || devServer.https ? 'https' : 'http';
 			let host = process.env.HOST || devServer.host || 'localhost';
@@ -98,7 +98,7 @@ async function prodBuild(env) {
 		let stats = await runCompiler(clientCompiler);
 
 		// Timeout for plugins that work on `after-emit` event of webpack
-		await new Promise((r) => setTimeout(r, 20));
+		await new Promise(r => setTimeout(r, 20));
 
 		return showStats(stats, true);
 	} catch (err) {
@@ -126,13 +126,13 @@ function showStats(stats, isProd) {
 		if (stats.hasErrors()) {
 			allFields(stats, 'errors')
 				.map(stripLoaderPrefix)
-				.forEach((msg) => error(msg, isProd ? 1 : 0));
+				.forEach(msg => error(msg, isProd ? 1 : 0));
 		}
 
 		if (stats.hasWarnings()) {
 			allFields(stats, 'warnings')
 				.map(stripLoaderPrefix)
-				.forEach((msg) => {
+				.forEach(msg => {
 					if (
 						msg.match(
 							/Conflict: Multiple assets emit different content to the same filename .*\.(css|map)/
@@ -162,7 +162,7 @@ function writeJsonStats(stats) {
 
 	function strip(stats) {
 		stats.modules.forEach(stripLoaderFromModuleNames);
-		stats.chunks.forEach((c) => {
+		stats.chunks.forEach(c => {
 			(
 				c.modules ||
 				(c.mapModules != null ? c.mapModules(Object) : c.getModules())
@@ -189,7 +189,7 @@ function allFields(stats, field, fields = [], name = null) {
 		warnings: false,
 		errorDetails: false,
 	});
-	const addCompilerPrefix = (msg) =>
+	const addCompilerPrefix = msg =>
 		name ? bold(magenta(name + ': ')) + msg : msg;
 	if (field === 'errors' && stats.hasErrors()) {
 		fields = fields.concat(info.errors.map(addCompilerPrefix));
@@ -271,7 +271,7 @@ module.exports = function (env, watch = false) {
 	env.src = isDir(src) ? src : env.cwd;
 
 	// attach sourcing helper
-	env.source = (dir) => resolve(env.src, dir);
+	env.source = dir => resolve(env.src, dir);
 
 	// determine build-type to run
 	return (watch ? devBuild : prodBuild)(env);

packages/cli/lib/lib/webpack/transform-config.js

@@ -90,7 +90,7 @@ function parseConfig(config) {
 	return transformers;
 }
 
-module.exports = async function(env, webpackConfig, isServer = false) {
+module.exports = async function (env, webpackConfig, isServer = false) {
 	const { configFile, isDefault } =
 		env.config !== 'preact.config.js'
 			? { configFile: env.config, isDefault: false }
@@ -288,7 +288,7 @@ class WebpackConfigHelpers {
 		} catch (e) {}
 
 		let templatePath = isPath
-			? `!!ejs-loader!${resolve(this._cwd, template)}`
+			? `!!ejs-loader?esModule=false!${resolve(this._cwd, template)}`
 			: template;
 		let { plugin: htmlWebpackPlugin } = this.getPluginsByName(
 			config,

packages/cli/lib/lib/webpack/webpack-base-config.js

@@ -330,7 +330,7 @@ module.exports = function (env) {
 							patterns: [
 								{
 									regex: /throw\s+(new\s+)?(Type|Reference)?Error\s*\(/g,
-									value: (s) => `return;${Array(s.length - 7).join(' ')}(`,
+									value: s => `return;${Array(s.length - 7).join(' ')}(`,
 								},
 							],
 						}),