refactor bin entrypoint, add stackblitz support (#1029)

5 files changed, 100 insertions, 42 deletions

diff --git a/.changeset/swift-comics-hammer.md b/.changeset/swift-comics-hammer.md
new file mode 100644
index 000000000..9751252d7
--- /dev/null
+++ b/.changeset/swift-comics-hammer.md
@@ -0,0 +1,5 @@
+---
+'astro': patch
+---
+
+Refactor the CLI entrypoint to support stackblitz and improve the runtime check
diff --git a/packages/astro/astro.cjs b/packages/astro/astro.cjs
deleted file mode 100755
index 91d75cf2f..000000000
--- a/packages/astro/astro.cjs
+++ /dev/null
@@ -1,39 +0,0 @@
-#!/usr/bin/env node
-/* eslint-disable no-console */
-'use strict';
-const pkg = require('./package.json');
-const semver = require('semver');
-const ci = require('ci-info');
-const CI_INTRUCTIONS = {
-  NETLIFY: 'https://docs.netlify.com/configure-builds/manage-dependencies/#node-js-and-javascript',
-  GITHUB_ACTIONS: 'https://docs.github.com/en/actions/guides/building-and-testing-nodejs#specifying-the-nodejs-version',
-  VERCEL: 'https://vercel.com/docs/runtimes#official-runtimes/node-js/node-js-version',
-};
-
-/** Dynamically import the CLI after checking if this version of Node is supported */
-async function main() {
-  const engines = pkg.engines.node;
-  const version = process.versions.node;
-  const isSupported = semver.satisfies(version, engines);
-
-  if (!isSupported) {
-    console.error(`\nNode.js v${version} is not supported by Astro!
-Please upgrade to one of Node.js ${engines}.\n`);
-    if (ci.isCI) {
-      let platform;
-      for (const [key, value] of Object.entries(ci)) {
-        if (value === true) {
-          platform = key;
-          break;
-        }
-      }
-      console.log(`To set the Node.js version for ${ci.name}, reference the official documentation`);
-      if (CI_INTRUCTIONS[platform]) console.log(CI_INTRUCTIONS[platform]);
-    }
-    process.exit(1);
-  }
-
-  await import('./dist/cli.js').then(({ cli }) => cli(process.argv));
-}
-
-main();
diff --git a/packages/astro/astro.js b/packages/astro/astro.js
new file mode 100755
index 000000000..5bc54e4a4
--- /dev/null
+++ b/packages/astro/astro.js
@@ -0,0 +1,72 @@
+#!/usr/bin/env node
+/* eslint-disable no-console */
+'use strict';
+
+// ISOMORPHIC FILE: NO TOP-LEVEL IMPORT/REQUIRE() ALLOWED
+// This file has to run as both ESM and CJS on older Node.js versions
+// Assume ESM to start, and then call `require()` below once CJS is confirmed.
+// Needed for Stackblitz: https://github.com/stackblitz/webcontainer-core/issues/281
+
+const CI_INTRUCTIONS = {
+  NETLIFY: 'https://docs.netlify.com/configure-builds/manage-dependencies/#node-js-and-javascript',
+  GITHUB_ACTIONS: 'https://docs.github.com/en/actions/guides/building-and-testing-nodejs#specifying-the-nodejs-version',
+  VERCEL: 'https://vercel.com/docs/runtimes#official-runtimes/node-js/node-js-version',
+};
+
+async function main() {
+  // Check for ESM support by loading the "supports-esm" in an way that works in both ESM & CJS.
+  const supportsESM = typeof require !== 'undefined' ? require('supports-esm') : (await import('supports-esm')).default;
+  
+  // Supported: load Astro and run. Enjoy!
+  if (supportsESM) {
+    return import('./dist/cli.js')
+      .then(({ cli }) => cli(process.argv))
+      .catch((error) => {
+        console.error(error);
+        process.exit(1);
+      });
+  }
+
+  // Not supported: Report the most helpful error message possible.
+  const pkg = require('./package.json');
+  const ci = require('ci-info');
+  const semver = require('semver');
+  const engines = pkg.engines.node;
+  const version = process.versions.node;
+  
+  // TODO: Remove "semver" in Astro v1.0: This is mainly just to check our work. Once run in 
+  // the wild for a bit without error, we can assume our engine range is correct and won't
+  // change over time.
+  const isSupported = semver.satisfies(version, engines);
+  if (isSupported) {
+    console.error(`\nNode.js v${version} is not supported by Astro!
+Supported versions: ${engines}\n
+Issue Detected! This Node.js version was expected to work, but failed a system check.
+Please file an issue so that we can take a look: https://github.com/snowpackjs/astro/issues/new\n`);
+  } else {
+    console.error(`\nNode.js v${version} is not supported by Astro!
+Please upgrade Node.js to a supported version: "${engines}"\n`);
+  }
+
+  // Special instructions for CI environments, which may have special steps needed.
+  // This is a common issue that we can help users with proactively.
+  if (ci.isCI) {
+    let platform;
+    for (const [key, value] of Object.entries(ci)) {
+      if (value === true) {
+        platform = key;
+        break;
+      }
+    }
+    console.log(`${ci.name} CI Environment Detected!\nAdditional steps may be needed to set your Node.js version:`);
+    console.log(`Documentation: https://docs.astro.build/guides/deploy`);
+    if (CI_INTRUCTIONS[platform]) {
+      console.log(`${ci.name} Documentation: ${CI_INTRUCTIONS[platform]}`);
+    }
+    console.log(``);
+  }
+
+  process.exit(1);
+}
+
+main();
diff --git a/packages/astro/package.json b/packages/astro/package.json
index a248261bd..33eb499d2 100644
--- a/packages/astro/package.json
+++ b/packages/astro/package.json
@@ -11,7 +11,7 @@
     "directory": "packages/astro"
   },
   "exports": {
-    ".": "./astro.cjs",
+    ".": "./astro.js",
     "./package.json": "./package.json",
     "./snowpack-plugin": "./snowpack-plugin.cjs",
     "./snowpack-plugin-jsx": "./snowpack-plugin-jsx.cjs",
@@ -26,7 +26,7 @@
     "#astro/*": "./dist/*.js"
   },
   "bin": {
-    "astro": "astro.cjs"
+    "astro": "astro.js"
   },
   "files": [
     "components",
@@ -60,8 +60,8 @@
     "acorn": "^7.4.0",
     "astring": "^1.7.4",
     "autoprefixer": "^10.2.5",
-    "camel-case": "^4.1.2",
     "babel-plugin-module-resolver": "^4.1.0",
+    "camel-case": "^4.1.2",
     "cheerio": "^1.0.0-rc.6",
     "ci-info": "^3.2.0",
     "del": "^6.0.0",
@@ -93,6 +93,7 @@
     "slash": "^4.0.0",
     "snowpack": "^3.8.3",
     "string-width": "^5.0.0",
+    "supports-esm": "^1.0.0",
     "tiny-glob": "^0.2.8",
     "unified": "^9.2.1",
     "yargs-parser": "^20.2.7"
diff --git a/yarn.lock b/yarn.lock
index fef1ed0ba..02f0f7d1a 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1325,6 +1325,11 @@
   resolved "https://registry.yarnpkg.com/@lit/reactive-element/-/reactive-element-1.0.0-rc.2.tgz#f24dba16ea571a08dca70f1783bd2ca5ec8de3ee"
   integrity sha512-cujeIl5Ei8FC7UHf4/4Q3bRJOtdTe1vpJV/JEBYCggedmQ+2P8A2oz7eE+Vxi6OJ4nc0X+KZxXnBoH4QrEbmEQ==
 
+"@ljharb/has-package-exports-patterns@0.0.1":
+  version "0.0.1"
+  resolved "https://registry.yarnpkg.com/@ljharb/has-package-exports-patterns/-/has-package-exports-patterns-0.0.1.tgz#70f07047b058e0909488a0ab1928afb95a9326d0"
+  integrity sha512-J4HxcjHI8EzVwXj2HKfZrwnWv4wmOhGxSHyxDQLhiL4ibwRoIkYBqsacZUXFUWQzJtW6QC+FKSNy8HqKjkEqaQ==
+
 "@manypkg/find-root@^1.1.0":
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/@manypkg/find-root/-/find-root-1.1.0.tgz#a62d8ed1cd7e7d4c11d9d52a8397460b5d4ad29f"
@@ -5085,6 +5090,13 @@ has-flag@^4.0.0:
   resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-4.0.0.tgz#944771fd9c81c81265c4d6941860da06bb59479b"
   integrity sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==
 
+has-package-exports@^1.1.0:
+  version "1.2.3"
+  resolved "https://registry.yarnpkg.com/has-package-exports/-/has-package-exports-1.2.3.tgz#4cd984c761140156e27aea7cae9473a3dd0cc4d9"
+  integrity sha512-lkLLwrNNaRsmwj+TylZJh1o3YlzLfgrl9fZKOAMj4MHjbvt7wy1J0icE6jD36dzkA0aQGoNuqY0hVN2uuPfPBA==
+  dependencies:
+    "@ljharb/has-package-exports-patterns" "0.0.1"
+
 has-symbols@^1.0.1, has-symbols@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/has-symbols/-/has-symbols-1.0.2.tgz#165d3070c00309752a1236a479331e3ac56f1423"
@@ -9697,6 +9709,13 @@ supports-color@^7.0.0, supports-color@^7.1.0:
   dependencies:
     has-flag "^4.0.0"
 
+supports-esm@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/supports-esm/-/supports-esm-1.0.0.tgz#7cc567747d0745e2b77b331c9b9cae13cf4dc60e"
+  integrity sha512-96Am8CDqUaC0I2+C/swJ0yEvM8ZnGn4unoers/LSdE4umhX7mELzqyLzx3HnZAluq5PXIsGMKqa7NkqaeHMPcg==
+  dependencies:
+    has-package-exports "^1.1.0"
+
 svelte-hmr@^0.13.2:
   version "0.13.5"
   resolved "https://registry.yarnpkg.com/svelte-hmr/-/svelte-hmr-0.13.5.tgz#de9b5fdcf0b694616bab2eb708d1c5bdf4043584"