fix: improve Webiny CLI developer-experience (#4455)

Author: adrians5j

packages/cli-plugin-deploy-pulumi/commands/newWatch.js

@@ -121,8 +121,10 @@ module.exports = async (inputs, context) => {
     const learnMoreLink = "https://webiny.link/local-aws-lambda-development";
 
     context.info(`Local AWS Lambda development session started.`);
-    context.info(
-        `Note that you should deploy your changes once you're done. To do so, run: %s. Learn more: %s.`,
+    context.warning(
+        `Note that once the session is terminated, the %s application will no longer work. To fix this, you %s redeploy it via the %s command. Learn more: %s.`,
+        projectApplication.name,
+        "MUST",
         deployCommand,
         learnMoreLink
     );
@@ -141,9 +143,11 @@ module.exports = async (inputs, context) => {
         console.log();
         console.log();
 
-        context.info(`Stopping local AWS Lambda development session.`);
-        context.info(
-            `Note that you should deploy your changes. To do so, run: %s. Learn more: %s.`,
+        context.info(`Terminating local AWS Lambda development session.`);
+        context.warning(
+            `Note that once the session is terminated, the %s application will no longer work. To fix this, you %s redeploy it via the %s command. Learn more: %s.`,
+            projectApplication.name,
+            "MUST",
             deployCommand,
             learnMoreLink
         );

packages/cli-plugin-deploy-pulumi/commands/newWatch/listPackages.js

@@ -56,6 +56,12 @@ const listPackages = async ({ inputs }) => {
                 ? path.join(root, "webiny.config.ts")
                 : path.join(root, "webiny.config.js");
 
+            // We need this because newly introduced extension
+            // packages do not have a Webiny config file.
+            if (!fs.existsSync(configPath)) {
+                continue;
+            }
+
             packages.push({
                 name: packageName,
                 config: require(configPath).default || require(configPath),

packages/cli-plugin-extensions/src/downloadAndLinkExtension.ts

@@ -159,6 +159,14 @@ export const downloadAndLinkExtension = async ({
                 console.log(`  ‣ ${context.success.hl(p)}`);
             });
         }
+
+        console.log();
+        console.log(chalk.bold("Additional Notes"));
+        console.log(
+            `‣ note that if you already have the ${context.success.hl(
+                "webiny watch"
+            )} command running, you'll need to restart it`
+        );
     } catch (e) {
         switch (e.code) {
             case "NO_OBJECTS_FOUND":

packages/cli-plugin-extensions/src/extensions/AdminExtension.ts

@@ -30,7 +30,7 @@ export class AdminExtension extends AbstractExtension {
         const indexTsxFilePath = `${extensionsFolderPath}/src/index.tsx`;
 
         return [
-            `run ${chalk.green(watchCommand)} to start a new local development session`,
+            `run ${chalk.green(watchCommand)} to start local development`,
             `open ${chalk.green(indexTsxFilePath)} and start coding`,
             `to install additional dependencies, run ${chalk.green(
                 `yarn workspace ${this.params.packageName} add <package-name>`

packages/cli-plugin-extensions/src/extensions/ApiExtension.ts

@@ -30,7 +30,7 @@ export class ApiExtension extends AbstractExtension {
         const indexTsxFilePath = `${extensionsFolderPath}/src/index.ts`;
 
         return [
-            `run ${chalk.green(watchCommand)} to start a new local development session`,
+            `run ${chalk.green(watchCommand)} to start local development`,
             `open ${chalk.green(indexTsxFilePath)} and start coding`,
             `to install additional dependencies, run ${chalk.green(
                 `yarn workspace ${this.params.packageName} add <package-name>`

packages/cli-plugin-extensions/src/extensions/PbElementExtension.ts

@@ -37,7 +37,7 @@ export class PbElementExtension extends AbstractExtension {
 
         return [
             [
-                `run the following commands to start local development sessions:`,
+                `run the following commands to start local development:`,
                 `  ∙ ${chalk.green(watchCommandAdmin)}`,
                 `  ∙ ${chalk.green(watchCommandWebsite)}`
             ].join("\n"),

packages/cli-plugin-extensions/src/generateExtension.ts

@@ -158,6 +158,14 @@ export const generateExtension = async ({ input, ora, context }: GenerateExtensi
                 console.log(`‣ ${message}`);
             });
         }
+
+        console.log();
+        console.log(chalk.bold("Additional Notes"));
+        console.log(
+            `‣ note that if you already have the ${context.success.hl(
+                "webiny watch"
+            )} command running, you'll need to restart it`
+        );
     } catch (err) {
         ora.fail("Could not create extension. Please check the logs below.");
         console.log();

packages/project-utils/bundling/function/watchFunction.js

@@ -31,16 +31,29 @@ module.exports = async options => {
     }
 
     return new Promise(async (resolve, reject) => {
-        options.logs && console.log("Compiling...");
+        let initialCompilation = true;
+        if (options.logs) {
+            const message = initialCompilation ? "Initial compilation started..." : "Compiling...";
+            console.log(message);
+        }
+
         return webpack(webpackConfig).watch({}, async (err, stats) => {
             if (err) {
                 return reject(err);
             }
 
-            if (!stats.hasErrors()) {
-                options.logs && console.log("Compiled successfully.");
-            } else {
-                options.logs && console.log(stats.toString("errors-warnings"));
+            if (!options.logs) {
+                return;
+            }
+
+            if (stats.hasErrors()) {
+                console.log(stats.toString("errors-warnings"));
+                return;
+            }
+
+            if (initialCompilation) {
+                initialCompilation = false;
+                console.log("Initial compilation completed. Watching for changes...");
             }
         });
     });