Implement a double compilation flow for the develop command

>
>
Co-authored-by: Ben Irvin <ben@innerdvations.com>

packages/core/strapi/lib/commands/actions/develop/action.js

@@ -48,7 +48,7 @@ module.exports = async ({ build, watchAdmin, polling, browser }) => {
 
 const primaryProcess = async ({ distDir, appDir, build, isTSProject, watchAdmin, browser }) => {
   if (isTSProject) {
-    await buildTypeScript({ srcDir: appDir, distDir, watch: false });
+    await buildTypeScript({ srcDir: appDir, distDir, ignoreDiagnostics: true });
   }
 
   const config = loadConfiguration({ appDir, distDir });
@@ -84,7 +84,7 @@ const primaryProcess = async ({ distDir, appDir, build, isTSProject, watchAdmin,
     switch (message) {
       case 'reload':
         if (isTSProject) {
-          await buildTypeScript({ srcDir: appDir, distDir, watch: false });
+          await buildTypeScript({ srcDir: appDir, distDir, ignoreDiagnostics: true });
         }
 
         console.info('The server is restarting\n');
@@ -113,21 +113,16 @@ const workerProcess = async ({ appDir, distDir, watchAdmin, polling, isTSProject
     serveAdminPanel: !watchAdmin,
   }).load();
 
-  /**
-   * TypeScript automatic type generation upon dev server restart
-   * Its implementation, configuration and behavior can change in future releases
-   * @experimental
-   */
-  const shouldGenerateTypeScriptTypes = strapiInstance.config.get('typescript.autogenerate', false);
+  await tsUtils.generators.generate({
+    strapi: strapiInstance,
+    pwd: appDir,
+    rootDir: undefined,
+    logger: { silent: true, debug: false },
+    artifacts: { contentTypes: true, components: true },
+  });
 
-  if (shouldGenerateTypeScriptTypes) {
-    await tsUtils.generators.generate({
-      strapi: strapiInstance,
-      pwd: appDir,
-      rootDir: undefined,
-      logger: { silent: true, debug: false },
-      artifacts: { contentTypes: true, components: true },
-    });
+  if (isTSProject) {
+    await buildTypeScript({ srcDir: appDir, distDir, ignoreDiagnostics: false });
   }
 
   const adminWatchIgnoreFiles = strapiInstance.config.get('admin.watchIgnoreFiles', []);

packages/core/strapi/lib/commands/builders/typescript.js

@@ -19,7 +19,7 @@ const cleanupDistDirectory = async (distDir) => {
   }
 };
 
-module.exports = async ({ srcDir, distDir, watch = false }) => {
+module.exports = async ({ srcDir, distDir, ignoreDiagnostics = false }) => {
   const isTSProject = await tsUtils.isUsingTypeScript(srcDir);
 
   if (!isTSProject) {
@@ -28,5 +28,5 @@ module.exports = async ({ srcDir, distDir, watch = false }) => {
 
   await cleanupDistDirectory(distDir);
 
-  return tsUtils.compile(srcDir, { watch });
+  return tsUtils.compile(srcDir, { configOptions: { ignoreDiagnostics } });
 };

packages/utils/typescript/lib/compile.js

@@ -3,12 +3,8 @@
 const compilers = require('./compilers');
 const getConfigPath = require('./utils/get-config-path');
 
-module.exports = async (srcDir, { watch = false, configOptions = {} } = {}) => {
-  // TODO: Use the Strapi debug logger instead or don't log at all
-  console.log(`Starting the compilation for TypeScript files in ${srcDir}`);
-
-  const compiler = watch ? compilers.watch : compilers.basic;
+module.exports = async (srcDir, { configOptions = {} } = {}) => {
   const configPath = getConfigPath(srcDir);
 
-  compiler.run(configPath, configOptions);
+  compilers.basic.run(configPath, configOptions);
 };

packages/utils/typescript/lib/compilers/basic.js

@@ -13,15 +13,23 @@ module.exports = {
    * @param {Object} configOptions
    * @param {Array.<string>} configOptions.fileNames
    * @param {Object} configOptions.options
+   * @param {boolean} configOptions.ignoreDiagnostics
    */
   run(tsConfigPath, configOptions = {}) {
+    const { ignoreDiagnostics = false } = configOptions;
     // Parse the tsconfig.json file & resolve the configuration options
     const { fileNames, options, projectReferences } = resolveConfigOptions(tsConfigPath);
 
+    const compilerOptions = merge(options, configOptions.options);
+
+    if (ignoreDiagnostics) {
+      Object.assign(compilerOptions, { noEmit: false, noEmitOnError: false });
+    }
+
     const program = ts.createProgram({
       rootNames: configOptions.fileNames ? configOptions.fileNames : fileNames,
       projectReferences,
-      options: merge(options, configOptions.options),
+      options: compilerOptions,
     });
 
     const emitResults = program.emit();
@@ -30,12 +38,12 @@ module.exports = {
       ts.getPreEmitDiagnostics(program).concat(emitResults.diagnostics)
     );
 
-    if (diagnostics.length > 0) {
+    if (!ignoreDiagnostics && diagnostics.length > 0) {
       reportDiagnostics(diagnostics);
     }
 
-    // If the compilation failed, exit early
-    if (emitResults.emitSkipped) {
+    // If the compilation failed and diagnostics are not ignored, exit early
+    if (!ignoreDiagnostics && emitResults.emitSkipped) {
       process.exit(1);
     }
   },

packages/utils/typescript/lib/compilers/index.js

@@ -1,9 +1,7 @@
 'use strict';
 
 const basic = require('./basic');
-const watch = require('./watch');
 
 module.exports = {
   basic,
-  watch,
 };

packages/utils/typescript/lib/compilers/watch.js

@@ -1,37 +0,0 @@
-'use strict';
-
-const ts = require('typescript');
-
-const reportDiagnostics = require('../utils/report-diagnostics');
-const formatHost = require('../utils/format-host');
-const resolveConfigOptions = require('../utils/resolve-config-options');
-
-/**
- * Prints a diagnostic every time the watch status changes.
- * This is mainly for messages like "Starting compilation" or "Compilation completed".
- */
-const reportWatchStatusChanged = (diagnostic) => {
-  console.info(ts.formatDiagnostic(diagnostic, formatHost));
-};
-
-module.exports = {
-  run(configPath) {
-    const createProgram = ts.createSemanticDiagnosticsBuilderProgram;
-
-    const { fileNames, options, projectReferences, watchOptions } =
-      resolveConfigOptions(configPath);
-
-    const host = ts.createWatchCompilerHost(
-      fileNames,
-      options,
-      ts.sys,
-      createProgram,
-      reportDiagnostics,
-      reportWatchStatusChanged,
-      projectReferences,
-      watchOptions
-    );
-
-    ts.createWatchProgram(host);
-  },
-};