From b1bf331d5fb5f012147671011433c9b80044eb11 Mon Sep 17 00:00:00 2001 From: Oliver Strobel Date: Thu, 25 Jun 2020 19:32:56 +0200 Subject: [PATCH 01/17] Enable webpack watch without dev server --- packages/cli/lib/commands/watch.js | 4 +++ packages/cli/lib/index.js | 12 +++++++ packages/cli/lib/lib/webpack/run-webpack.js | 34 +++++++++++++++++++ .../lib/lib/webpack/webpack-client-config.js | 2 +- 4 files changed, 51 insertions(+), 1 deletion(-) diff --git a/packages/cli/lib/commands/watch.js b/packages/cli/lib/commands/watch.js index d9cf4a5f6..73a01cc06 100644 --- a/packages/cli/lib/commands/watch.js +++ b/packages/cli/lib/commands/watch.js @@ -1,11 +1,15 @@ const runWebpack = require('../lib/webpack/run-webpack'); const { warn } = require('../util'); +const toBool = (val) => val === void 0 || (val === 'false' ? false : val); + module.exports = async function (src, argv) { if (argv.rhl) { delete argv.rhl; argv.refresh = argv.rhl; } + + argv.prerender = toBool(argv.prerender); argv.src = src || argv.src; argv.production = false; diff --git a/packages/cli/lib/index.js b/packages/cli/lib/index.js index 86bee372e..f40a7c54b 100755 --- a/packages/cli/lib/index.js +++ b/packages/cli/lib/index.js @@ -80,6 +80,18 @@ prog .option('--src', 'Specify source directory', 'src') .option('--cwd', 'A directory to use instead of $PWD', '.') .option('--esm', 'Builds ES-2015 bundles for your code', false) + .option('--devServer', 'Determine if dev server should be enabled', true) + .option( + '--dest', + 'Specify output directory if dev server is disabled', + 'build' + ) + .option( + '--ignore', + 'Path relative to src to be ignored during watch if dev server is disabled', + '' + ) + .option('--esm', 'Builds ES-2015 bundles for your code.', false) .option('--clear', 'Clear the console', true) .option('--sw', 'Generate and attach a Service Worker', undefined) .option('--babelConfig', 'Path to custom Babel config', '.babelrc') diff --git a/packages/cli/lib/lib/webpack/run-webpack.js b/packages/cli/lib/lib/webpack/run-webpack.js index 6e200786f..b8d2c23ef 100644 --- a/packages/cli/lib/lib/webpack/run-webpack.js +++ b/packages/cli/lib/lib/webpack/run-webpack.js @@ -16,6 +16,17 @@ async function devBuild(env) { await transformConfig(env, config); + const shouldRunDevServer = env.devServer; + + if (!shouldRunDevServer && env.prerender) { + let ssrConfig = serverConfig(env); + await transformConfig(env, ssrConfig, true); + let serverCompiler = webpack(ssrConfig); + await runWatch(serverCompiler, { + ignored: env.source(env.ignore), + }); + } + let userPort = parseInt(process.env.PORT || config.devServer.port, 10) || 8080; let port = await getPort({ port: userPort }); @@ -39,6 +50,8 @@ async function devBuild(env) { }); compiler.hooks.done.tap('CliDevPlugin', (stats) => { + if (!shouldRunDevServer) return; + let devServer = config.devServer; let protocol = process.env.HTTPS || devServer.https ? 'https' : 'http'; let host = process.env.HOST || devServer.host || 'localhost'; @@ -71,6 +84,13 @@ async function devBuild(env) { compiler.hooks.failed.tap('CliDevPlugin', rej); + if (!shouldRunDevServer) + return res( + runWatch(compiler, { + ignored: env.source(env.ignore), + }) + ); + let c = Object.assign({}, config.devServer, { stats: { colors: true }, }); @@ -121,6 +141,20 @@ function runCompiler(compiler) { }); } +function runWatch(compiler, options = {}) { + return new Promise((res, rej) => { + compiler.watch(options, (err, stats) => { + showStats(stats, true); + + if (err || (stats && stats.hasErrors())) { + rej(`${red('\n\nBuild failed! \n\n')} ${err || ''}`); + } + + res(stats); + }); + }); +} + function showStats(stats, isProd) { if (stats) { if (stats.hasErrors()) { diff --git a/packages/cli/lib/lib/webpack/webpack-client-config.js b/packages/cli/lib/lib/webpack/webpack-client-config.js index 5a99326a4..9c4f7e537 100644 --- a/packages/cli/lib/lib/webpack/webpack-client-config.js +++ b/packages/cli/lib/lib/webpack/webpack-client-config.js @@ -26,7 +26,7 @@ const cleanFilename = (name) => ); async function clientConfig(env) { - const { isProd, source, src, cwd /*, port? */ } = env; + const { isProd, source, src, cwd, devServer /*, port? */ } = env; const IS_SOURCE_PREACT_X_OR_ABOVE = isInstalledVersionPreactXOrAbove(cwd); const asyncLoader = IS_SOURCE_PREACT_X_OR_ABOVE ? require.resolve('@preact/async-loader') From 690cd87a4a27042bf964e5fe5be5a68030691c19 Mon Sep 17 00:00:00 2001 From: Oliver Strobel Date: Mon, 29 Jun 2020 16:00:13 +0200 Subject: [PATCH 02/17] Add options to README --- README.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/README.md b/README.md index 1261fa82f..6200a2c19 100644 --- a/README.md +++ b/README.md @@ -137,6 +137,9 @@ $ preact watch --src Specify source directory (default src) --cwd A directory to use instead of $PWD (default .) + --devServer Determine if dev server should be enabled (default true) + --dest Specify output directory if dev server is disabled (default build) + --ignore Path relative to src to be ignored during watch if dev server is disabled --esm Builds ES-2015 bundles for your code (default false) --clear Clear the console (default true) --sw Generate and attach a Service Worker (default false) From ee0d902af028ab81d08947e3cd2137341546d782 Mon Sep 17 00:00:00 2001 From: Ryan Christian Date: Tue, 15 Sep 2020 19:24:09 -0500 Subject: [PATCH 03/17] refactor: Reorganzing command list --- README.md | 6 +++--- packages/cli/lib/index.js | 16 ++++++++-------- 2 files changed, 11 insertions(+), 11 deletions(-) diff --git a/README.md b/README.md index 6200a2c19..4e489ecc1 100644 --- a/README.md +++ b/README.md @@ -136,10 +136,8 @@ Spin up a development server with multiple features like `hot-module-replacement $ preact watch --src Specify source directory (default src) - --cwd A directory to use instead of $PWD (default .) - --devServer Determine if dev server should be enabled (default true) --dest Specify output directory if dev server is disabled (default build) - --ignore Path relative to src to be ignored during watch if dev server is disabled + --cwd A directory to use instead of $PWD (default .) --esm Builds ES-2015 bundles for your code (default false) --clear Clear the console (default true) --sw Generate and attach a Service Worker (default false) @@ -153,6 +151,8 @@ $ preact watch --prerenderUrls Path to pre-rendered routes config (default prerender-urls.json) --template Path to custom HTML template --refresh Will use [`Preact-refresh`](https://github.com/JoviDeCroock/preact-refresh) to do hot-reloading + --devServer Determine if dev server should be enabled (default true) + --ignore Path relative to src to be ignored during watch if dev server is disabled -c, --config Path to custom CLI config (default preact.config.js) -H, --host Set server hostname (default 0.0.0.0) -p, --port Set server port (default 8080) diff --git a/packages/cli/lib/index.js b/packages/cli/lib/index.js index f40a7c54b..345dbdcca 100755 --- a/packages/cli/lib/index.js +++ b/packages/cli/lib/index.js @@ -78,19 +78,13 @@ prog .command('watch [src]') .describe('Start a live-reload server for development') .option('--src', 'Specify source directory', 'src') - .option('--cwd', 'A directory to use instead of $PWD', '.') - .option('--esm', 'Builds ES-2015 bundles for your code', false) - .option('--devServer', 'Determine if dev server should be enabled', true) .option( '--dest', 'Specify output directory if dev server is disabled', 'build' ) - .option( - '--ignore', - 'Path relative to src to be ignored during watch if dev server is disabled', - '' - ) + .option('--cwd', 'A directory to use instead of $PWD', '.') + .option('--esm', 'Builds ES-2015 bundles for your code', false) .option('--esm', 'Builds ES-2015 bundles for your code.', false) .option('--clear', 'Clear the console', true) .option('--sw', 'Generate and attach a Service Worker', undefined) @@ -113,6 +107,12 @@ prog 'Enables experimental preact-refresh functionality', false ) + .option('--devServer', 'Determine if dev server should be enabled', true) + .option( + '--ignore', + 'Path relative to src to be ignored during watch if dev server is disabled', + '' + ) .option('-c, --config', 'Path to custom CLI config', 'preact.config.js') .option('-H, --host', 'Set server hostname', '0.0.0.0') .option('-p, --port', 'Set server port', 8080) From 486dd3034a1e7b153631fbf94d52ef12a73264a8 Mon Sep 17 00:00:00 2001 From: Ryan Christian Date: Tue, 15 Sep 2020 20:18:43 -0500 Subject: [PATCH 04/17] refactor: Removing unused var in webpack-client-config --- packages/cli/lib/lib/webpack/webpack-client-config.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/cli/lib/lib/webpack/webpack-client-config.js b/packages/cli/lib/lib/webpack/webpack-client-config.js index 9c4f7e537..3939c8e5d 100644 --- a/packages/cli/lib/lib/webpack/webpack-client-config.js +++ b/packages/cli/lib/lib/webpack/webpack-client-config.js @@ -26,7 +26,7 @@ const cleanFilename = (name) => ); async function clientConfig(env) { - const { isProd, source, src, cwd, devServer /*, port? */ } = env; + const { isProd, source, src, cwd /*, port? */ } = env; const IS_SOURCE_PREACT_X_OR_ABOVE = isInstalledVersionPreactXOrAbove(cwd); const asyncLoader = IS_SOURCE_PREACT_X_OR_ABOVE ? require.resolve('@preact/async-loader') @@ -184,7 +184,7 @@ function isProd(config) { 'process.env.ESM': config.esm, 'process.env.PRERENDER': config.prerender, }), - new SizePlugin() + new SizePlugin(), ], optimization: { From fc58379dce5d319f3d948676e2c278936a7e650c Mon Sep 17 00:00:00 2001 From: Ryan Christian Date: Tue, 15 Sep 2020 20:39:52 -0500 Subject: [PATCH 05/17] refactor(flag): Removing `ignore` flag for now, can re-add later --- packages/cli/lib/index.js | 5 ----- packages/cli/lib/lib/webpack/run-webpack.js | 11 ++--------- 2 files changed, 2 insertions(+), 14 deletions(-) diff --git a/packages/cli/lib/index.js b/packages/cli/lib/index.js index 345dbdcca..71137d870 100755 --- a/packages/cli/lib/index.js +++ b/packages/cli/lib/index.js @@ -108,11 +108,6 @@ prog false ) .option('--devServer', 'Determine if dev server should be enabled', true) - .option( - '--ignore', - 'Path relative to src to be ignored during watch if dev server is disabled', - '' - ) .option('-c, --config', 'Path to custom CLI config', 'preact.config.js') .option('-H, --host', 'Set server hostname', '0.0.0.0') .option('-p, --port', 'Set server port', 8080) diff --git a/packages/cli/lib/lib/webpack/run-webpack.js b/packages/cli/lib/lib/webpack/run-webpack.js index b8d2c23ef..c178c6bb8 100644 --- a/packages/cli/lib/lib/webpack/run-webpack.js +++ b/packages/cli/lib/lib/webpack/run-webpack.js @@ -22,9 +22,7 @@ async function devBuild(env) { let ssrConfig = serverConfig(env); await transformConfig(env, ssrConfig, true); let serverCompiler = webpack(ssrConfig); - await runWatch(serverCompiler, { - ignored: env.source(env.ignore), - }); + await runWatch(serverCompiler); } let userPort = @@ -84,12 +82,7 @@ async function devBuild(env) { compiler.hooks.failed.tap('CliDevPlugin', rej); - if (!shouldRunDevServer) - return res( - runWatch(compiler, { - ignored: env.source(env.ignore), - }) - ); + if (!shouldRunDevServer) return res(runWatch(compiler)); let c = Object.assign({}, config.devServer, { stats: { colors: true }, From 1aff257c47823a5126476831b246785caa42473c Mon Sep 17 00:00:00 2001 From: Ryan Christian Date: Tue, 15 Sep 2020 20:44:37 -0500 Subject: [PATCH 06/17] fix: Ensuring dev build gets cleared like prod's --- packages/cli/lib/commands/watch.js | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/packages/cli/lib/commands/watch.js b/packages/cli/lib/commands/watch.js index 73a01cc06..61cec5f7d 100644 --- a/packages/cli/lib/commands/watch.js +++ b/packages/cli/lib/commands/watch.js @@ -1,5 +1,8 @@ -const runWebpack = require('../lib/webpack/run-webpack'); +const rimraf = require('rimraf'); +const { resolve } = require('path'); +const { promisify } = require('util'); const { warn } = require('../util'); +const runWebpack = require('../lib/webpack/run-webpack'); const toBool = (val) => val === void 0 || (val === 'false' ? false : val); @@ -22,5 +25,10 @@ module.exports = async function (src, argv) { } } + if (argv.clean === void 0) { + let dest = resolve(argv.cwd, argv.dest); + await promisify(rimraf)(dest); + } + return runWebpack(argv, true); }; From f48a788bf27c38c405b4c07ca57a3622355d79dc Mon Sep 17 00:00:00 2001 From: Ryan Christian Date: Wed, 16 Sep 2020 00:00:54 -0500 Subject: [PATCH 07/17] style: Formatting --- packages/cli/lib/commands/watch.js | 2 +- packages/cli/lib/lib/webpack/run-webpack.js | 1 - 2 files changed, 1 insertion(+), 2 deletions(-) diff --git a/packages/cli/lib/commands/watch.js b/packages/cli/lib/commands/watch.js index 61cec5f7d..eba205e15 100644 --- a/packages/cli/lib/commands/watch.js +++ b/packages/cli/lib/commands/watch.js @@ -12,9 +12,9 @@ module.exports = async function (src, argv) { argv.refresh = argv.rhl; } - argv.prerender = toBool(argv.prerender); argv.src = src || argv.src; argv.production = false; + argv.prerender = toBool(argv.prerender); if (argv.https || process.env.HTTPS) { let { key, cert, cacert } = argv; diff --git a/packages/cli/lib/lib/webpack/run-webpack.js b/packages/cli/lib/lib/webpack/run-webpack.js index c178c6bb8..54d21cfc8 100644 --- a/packages/cli/lib/lib/webpack/run-webpack.js +++ b/packages/cli/lib/lib/webpack/run-webpack.js @@ -13,7 +13,6 @@ const { error, isDir, warn } = require('../../util'); async function devBuild(env) { let config = await clientConfig(env); - await transformConfig(env, config); const shouldRunDevServer = env.devServer; From d2bc3424c11b30033bb56373b9b6704bd2a10526 Mon Sep 17 00:00:00 2001 From: Ryan Christian Date: Wed, 16 Sep 2020 00:38:07 -0500 Subject: [PATCH 08/17] docs(readme): Removing left over docs for `ignore` flag --- README.md | 1 - 1 file changed, 1 deletion(-) diff --git a/README.md b/README.md index 4e489ecc1..5f7cb9764 100644 --- a/README.md +++ b/README.md @@ -152,7 +152,6 @@ $ preact watch --template Path to custom HTML template --refresh Will use [`Preact-refresh`](https://github.com/JoviDeCroock/preact-refresh) to do hot-reloading --devServer Determine if dev server should be enabled (default true) - --ignore Path relative to src to be ignored during watch if dev server is disabled -c, --config Path to custom CLI config (default preact.config.js) -H, --host Set server hostname (default 0.0.0.0) -p, --port Set server port (default 8080) From 59e35cf4ec42fdab17d190c983188e7bc171d3eb Mon Sep 17 00:00:00 2001 From: Ryan Christian Date: Wed, 16 Sep 2020 00:39:44 -0500 Subject: [PATCH 09/17] fix: Removing duplicate `esm` flag in watch cmd --- packages/cli/lib/index.js | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/cli/lib/index.js b/packages/cli/lib/index.js index 71137d870..3892deda9 100755 --- a/packages/cli/lib/index.js +++ b/packages/cli/lib/index.js @@ -85,7 +85,6 @@ prog ) .option('--cwd', 'A directory to use instead of $PWD', '.') .option('--esm', 'Builds ES-2015 bundles for your code', false) - .option('--esm', 'Builds ES-2015 bundles for your code.', false) .option('--clear', 'Clear the console', true) .option('--sw', 'Generate and attach a Service Worker', undefined) .option('--babelConfig', 'Path to custom Babel config', '.babelrc') From 2e000dbd302d96e10b290abf56edc7c56c35ab8c Mon Sep 17 00:00:00 2001 From: Ryan Christian Date: Wed, 16 Sep 2020 01:39:33 -0500 Subject: [PATCH 10/17] fix: Correcting watch's `toBool` as it was backwards --- packages/cli/lib/commands/watch.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/cli/lib/commands/watch.js b/packages/cli/lib/commands/watch.js index eba205e15..4fe05ef7d 100644 --- a/packages/cli/lib/commands/watch.js +++ b/packages/cli/lib/commands/watch.js @@ -4,7 +4,7 @@ const { promisify } = require('util'); const { warn } = require('../util'); const runWebpack = require('../lib/webpack/run-webpack'); -const toBool = (val) => val === void 0 || (val === 'false' ? false : val); +const toBool = (val) => val !== void 0 || (val === 'false' ? false : val); module.exports = async function (src, argv) { if (argv.rhl) { From ff45bb8b4bce666a23797e5dd3e369d7a3dcce87 Mon Sep 17 00:00:00 2001 From: Ryan Christian Date: Wed, 16 Sep 2020 01:49:42 -0500 Subject: [PATCH 11/17] fix: Correcting `isProd` val in watchCompiler --- packages/cli/lib/lib/webpack/run-webpack.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/cli/lib/lib/webpack/run-webpack.js b/packages/cli/lib/lib/webpack/run-webpack.js index 54d21cfc8..fcc42e48c 100644 --- a/packages/cli/lib/lib/webpack/run-webpack.js +++ b/packages/cli/lib/lib/webpack/run-webpack.js @@ -136,7 +136,7 @@ function runCompiler(compiler) { function runWatch(compiler, options = {}) { return new Promise((res, rej) => { compiler.watch(options, (err, stats) => { - showStats(stats, true); + showStats(stats, false); if (err || (stats && stats.hasErrors())) { rej(`${red('\n\nBuild failed! \n\n')} ${err || ''}`); From 4d803e9ae2047e4d2b8202b27a182016ec274cb0 Mon Sep 17 00:00:00 2001 From: Ryan Christian Date: Wed, 16 Sep 2020 18:11:45 -0500 Subject: [PATCH 12/17] test: Fixing `watch` test --- packages/cli/tests/lib/cli.js | 11 +++++++---- 1 file changed, 7 insertions(+), 4 deletions(-) diff --git a/packages/cli/tests/lib/cli.js b/packages/cli/tests/lib/cli.js index 5c0a78ca2..b011bb3d6 100644 --- a/packages/cli/tests/lib/cli.js +++ b/packages/cli/tests/lib/cli.js @@ -20,7 +20,7 @@ const argv = { 'inline-css': true, }; -exports.create = async function(template, name) { +exports.create = async function (template, name) { let dest = tmpDir(); name = name || `test-${template}`; @@ -35,7 +35,7 @@ exports.create = async function(template, name) { return dest; }; -exports.build = function(cwd, options, installNodeModules = false) { +exports.build = function (cwd, options, installNodeModules = false) { if (!installNodeModules) { mkdirp.sync(join(cwd, 'node_modules')); // ensure exists, avoid exit() linkPackage('preact', root, cwd); @@ -48,7 +48,10 @@ exports.build = function(cwd, options, installNodeModules = false) { return cmd.build(argv.src, Object.assign({}, opts, options)); }; -exports.watch = function(cwd, port, host = '127.0.0.1') { - let opts = Object.assign({ cwd, host, port, https: false }, argv); +exports.watch = function (cwd, port, host = '127.0.0.1') { + let opts = Object.assign( + { cwd, host, port, https: false, devServer: true }, + argv + ); return cmd.watch(argv.src, opts); }; From d3d9b35bd77bc36715e403b802efb667d9e57bde Mon Sep 17 00:00:00 2001 From: Ryan Christian Date: Wed, 16 Sep 2020 18:35:59 -0500 Subject: [PATCH 13/17] fix: Resolving CSS issue with prerender --- packages/cli/lib/lib/webpack/webpack-base-config.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/cli/lib/lib/webpack/webpack-base-config.js b/packages/cli/lib/lib/webpack/webpack-base-config.js index 95eee591f..245dd9877 100644 --- a/packages/cli/lib/lib/webpack/webpack-base-config.js +++ b/packages/cli/lib/lib/webpack/webpack-base-config.js @@ -71,7 +71,7 @@ function getSassConfiguration(...includePaths) { } module.exports = function (env) { - const { cwd, isProd, isWatch, src, source } = env; + const { cwd, isProd, isWatch, devServer, src, source } = env; const babelConfigFile = env.babelConfig || '.babelrc'; const IS_SOURCE_PREACT_X_OR_ABOVE = isInstalledVersionPreactXOrAbove(cwd); // Apply base-level `env` values @@ -227,7 +227,7 @@ module.exports = function (env) { test: /\.(p?css|less|s[ac]ss|styl)$/, include: [source('components'), source('routes')], use: [ - isWatch ? 'style-loader' : MiniCssExtractPlugin.loader, + devServer ? 'style-loader' : MiniCssExtractPlugin.loader, { loader: 'css-loader', options: { @@ -253,7 +253,7 @@ module.exports = function (env) { test: /\.(p?css|less|s[ac]ss|styl)$/, exclude: [source('components'), source('routes')], use: [ - isWatch ? 'style-loader' : MiniCssExtractPlugin.loader, + devServer ? 'style-loader' : MiniCssExtractPlugin.loader, { loader: 'css-loader', options: { From 1777c224e286f1235c5391a684da77110ae20bdb Mon Sep 17 00:00:00 2001 From: Ryan Christian Date: Wed, 16 Sep 2020 18:36:11 -0500 Subject: [PATCH 14/17] refactor: Reusing some devServer options --- packages/cli/lib/lib/webpack/run-webpack.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/cli/lib/lib/webpack/run-webpack.js b/packages/cli/lib/lib/webpack/run-webpack.js index fcc42e48c..7eb9d2e8f 100644 --- a/packages/cli/lib/lib/webpack/run-webpack.js +++ b/packages/cli/lib/lib/webpack/run-webpack.js @@ -81,12 +81,12 @@ async function devBuild(env) { compiler.hooks.failed.tap('CliDevPlugin', rej); - if (!shouldRunDevServer) return res(runWatch(compiler)); - let c = Object.assign({}, config.devServer, { stats: { colors: true }, }); + if (!shouldRunDevServer) return res(runWatch(compiler, c)); + let server = new DevServer(compiler, c); server.listen(port); res(server); From 614d6070278f95f45cb4aadba44840d655e52628 Mon Sep 17 00:00:00 2001 From: Ryan Christian Date: Wed, 16 Sep 2020 20:24:56 -0500 Subject: [PATCH 15/17] refactor: Enabling prerendering if devServer is disabled --- packages/cli/lib/commands/watch.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/packages/cli/lib/commands/watch.js b/packages/cli/lib/commands/watch.js index 4fe05ef7d..12f4ac4d5 100644 --- a/packages/cli/lib/commands/watch.js +++ b/packages/cli/lib/commands/watch.js @@ -4,7 +4,7 @@ const { promisify } = require('util'); const { warn } = require('../util'); const runWebpack = require('../lib/webpack/run-webpack'); -const toBool = (val) => val !== void 0 || (val === 'false' ? false : val); +const toBool = (val) => val === void 0 || (val === 'false' ? false : val); module.exports = async function (src, argv) { if (argv.rhl) { @@ -14,7 +14,8 @@ module.exports = async function (src, argv) { argv.src = src || argv.src; argv.production = false; - argv.prerender = toBool(argv.prerender); + argv.devServer = toBool(argv.devServer); + if (!argv.devServer) argv.prerender = true; if (argv.https || process.env.HTTPS) { let { key, cert, cacert } = argv; From cbbe07073991f49df31a32feee2207bcb550fb16 Mon Sep 17 00:00:00 2001 From: Ryan Christian Date: Thu, 17 Sep 2020 15:32:13 -0500 Subject: [PATCH 16/17] test: Adding test for watch mode without devServer --- packages/cli/tests/lib/cli.js | 12 +++++++----- packages/cli/tests/watch.test.js | 25 +++++++++++++++++++++++++ 2 files changed, 32 insertions(+), 5 deletions(-) diff --git a/packages/cli/tests/lib/cli.js b/packages/cli/tests/lib/cli.js index b011bb3d6..f2a781d1e 100644 --- a/packages/cli/tests/lib/cli.js +++ b/packages/cli/tests/lib/cli.js @@ -48,10 +48,12 @@ exports.build = function (cwd, options, installNodeModules = false) { return cmd.build(argv.src, Object.assign({}, opts, options)); }; -exports.watch = function (cwd, port, host = '127.0.0.1') { - let opts = Object.assign( - { cwd, host, port, https: false, devServer: true }, - argv - ); +exports.watch = function (cwd, port, host = '127.0.0.1', devServer = true) { + if (!devServer) { + mkdirp.sync(join(cwd, 'node_modules')); // ensure exists, avoid exit() + linkPackage('preact', root, cwd); + linkPackage('preact-render-to-string', root, cwd); + } + let opts = Object.assign({ cwd, host, port, https: false, devServer }, argv); return cmd.watch(argv.src, opts); }; diff --git a/packages/cli/tests/watch.test.js b/packages/cli/tests/watch.test.js index 6979d4909..325afe5e5 100644 --- a/packages/cli/tests/watch.test.js +++ b/packages/cli/tests/watch.test.js @@ -2,6 +2,7 @@ const fs = require('../lib/fs'); const { resolve } = require('path'); const startChrome = require('./lib/chrome'); const { create, watch } = require('./lib/cli'); +const { sleep } = require('./lib/utils'); const { loadPage, waitUntilExpression } = startChrome; let chrome, server; @@ -33,4 +34,28 @@ describe('preact', () => { server.close(); }); + + it('should hot reload and prerender without a development server', async () => { + let dir = await create('default'); + await watch(dir, undefined, undefined, false); + + const initialContent = await fs.readFile( + resolve(dir, './build/bundle.js'), + 'utf8' + ); + + let header = resolve(dir, './src/components/header/index.js'); + let original = await fs.readFile(header, 'utf8'); + let update = original.replace('

Preact App

', '

Test App

'); + await fs.writeFile(header, update); + + await sleep(1500); // wait for a rebuild + const updatedContent = await fs.readFile( + resolve(dir, './build/bundle.js'), + 'utf8' + ); + + expect(updatedContent).not.toEqual(initialContent); + expect(updatedContent).not.toContain('Preact App'); + }); }); From 95e36a9b38ac255a89eed9f502efc15289a6797f Mon Sep 17 00:00:00 2001 From: Ryan Christian Date: Tue, 22 Sep 2020 16:03:30 -0500 Subject: [PATCH 17/17] fix(changeset): Adding changeset for this feature --- .changeset/ten-ligers-develop.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/ten-ligers-develop.md diff --git a/.changeset/ten-ligers-develop.md b/.changeset/ten-ligers-develop.md new file mode 100644 index 000000000..5aac56118 --- /dev/null +++ b/.changeset/ten-ligers-develop.md @@ -0,0 +1,5 @@ +--- +'preact-cli': minor +--- + +This change allows a user to disable the Webpack dev server while using the CLI's 'watch' mode. Useful for developing apps for SSR as this is much quicker without the production optimizations and will auto-run on changes to the source.