@live-codes/browser-compilers 0.4.14 → 0.5.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@live-codes/browser-compilers",
-  "version": "0.4.14",
+  "version": "0.5.0",
   "description": "Compilers that run in the browser, for use in livecodes.io",
   "author": "Hatem Hosny",
   "license": "MIT",
@@ -11,7 +11,7 @@
   "scripts": {
     "start": "live-server dist --port=8081 --no-browser --cors",
     "build": "run-s clean build:vendors copy:types",
-    "build:vendors": "node ./scripts/vendors.js",
+    "build:vendors": "node ./scripts/vendors.js && node ./scripts/vendors-module.mjs",
     "copy:types": "recursive-copy vendor_modules/types dist/types",
     "gh-pages": "gh-pages -m \"[ci skip] Updates\" -d dist",
     "fix": "run-s fix:*",
@@ -26,19 +26,22 @@
     "prepush": "run-s fix build"
   },
   "dependencies": {
-    "@esbuild-plugins/node-globals-polyfill": "0.1.0",
-    "@esbuild-plugins/node-modules-polyfill": "0.1.1",
-    "@mdx-js/mdx": "1.6.22",
-    "@prettier/plugin-pug": "1.17.3",
+    "@esbuild-plugins/node-globals-polyfill": "0.1.1",
+    "@esbuild-plugins/node-modules-polyfill": "0.1.4",
+    "@mdx-js/mdx": "2.0.0",
+    "@prettier/plugin-pug": "1.19.2",
     "@webassemblyjs/wast-refmt": "1.11.1",
-    "babel-preset-solid": "1.2.1",
+    "babel-preset-solid": "1.3.5",
+    "esbuild-plugin-cache": "0.2.9",
+    "esbuild-plugin-velcro": "0.1.1",
     "less": "4.1.2",
     "monaco-editor": "0.29.1",
-    "postcss": "8.3.11",
-    "postcss-preset-env": "6.7.0",
+    "postcss": "8.4.6",
+    "postcss-preset-env": "7.3.1",
     "react": "17.0.2",
     "react-dom": "17.0.2",
     "react-native-web": "0.17.5",
+    "remark-gfm": "3.0.1",
     "sass": "1.49.7",
     "svelte": "3.44.1",
     "windicss": "3.2.1"
@@ -49,9 +52,10 @@
     "@types/prettier": "2.1.6",
     "@typescript-eslint/eslint-plugin": "4.8.2",
     "@typescript-eslint/parser": "4.8.2",
-    "autoprefixer": "10.4.0",
+    "autoprefixer": "10.4.2",
     "cz-conventional-changelog": "3.2.0",
     "esbuild": "0.11.12",
+    "esbuild-plugin-node-polyfills": "1.0.2",
     "eslint": "7.32.0",
     "eslint-config-prettier": "6.11.0",
     "eslint-plugin-import": "2.20.2",

package/scripts/patch.js

@@ -0,0 +1,25 @@
+var fs = require('fs');
+var path = require('path');
+
+const patch = (
+  /** @type {string} */ filePath,
+  /** @type {Record<string, string>} */ replacements = {},
+) =>
+  new Promise((resolve, reject) => {
+    fs.readFile(path.resolve(filePath), 'utf8', function (err, data) {
+      if (err) return reject(err);
+
+      var result = data;
+      for (const key of Object.keys(replacements)) {
+        result = result.replace(key, replacements[key]);
+      }
+
+      fs.writeFile(path.resolve(filePath), result, 'utf8', function (err) {
+        if (err) return reject(err);
+
+        resolve();
+      });
+    });
+  });
+
+module.exports = { patch };

package/scripts/vendors-module.mjs

@@ -0,0 +1,21 @@
+import esbuild from 'esbuild';
+import { cache } from 'esbuild-plugin-cache';
+
+/** @type {Partial<esbuild.BuildOptions>} */
+const baseOptions = {
+  bundle: true,
+  minify: true,
+  format: 'iife',
+  define: { global: 'window', 'process.env.NODE_ENV': '"production"' },
+};
+
+// solid
+esbuild.build({
+  ...baseOptions,
+  entryPoints: ['vendor_modules/imports/babel-preset-solid.js'],
+  outfile: 'dist/babel-preset-solid/babel-preset-solid.js',
+  globalName: 'babelPresetSolid',
+  define: { global: 'window', 'process.env': '{}' },
+
+  plugins: [cache({})],
+});

package/scripts/vendors.js

@@ -4,8 +4,13 @@ var path = require('path');
 const esbuild = require('esbuild');
 const NodeModulesPolyfills = require('@esbuild-plugins/node-modules-polyfill').default;
 const GlobalsPolyfills = require('@esbuild-plugins/node-globals-polyfill').default;
+// const ESBuildNodePolyfillsPlugin = require('esbuild-plugin-node-polyfills');
+// const { createPlugin } = require('esbuild-plugin-velcro');
+
 const Bundler = require('parcel-bundler');
 
+const { patch } = require('./patch');
+
 const nodePolyfills = [
   NodeModulesPolyfills(),
   GlobalsPolyfills({
@@ -65,24 +70,15 @@ entryFiles.forEach(async (file) => {
 });
 
 // sass
-fs.readFile(path.resolve('node_modules/sass/sass.dart.js'), 'utf8', function (err, data) {
-  if (err) return console.log(err);
-
-  var result = data.replace(
-    'var self = Object.create(dartNodePreambleSelf);',
-    'var self = window;',
-  );
-
-  fs.writeFile(path.resolve('node_modules/sass/sass.dart.js'), result, 'utf8', function (err) {
-    if (err) return console.log(err);
-
-    esbuild.build({
-      ...baseOptions,
-      entryPoints: ['vendor_modules/imports/sass.ts'],
-      outfile: 'dist/sass/sass.js',
-      globalName: 'sass',
-      plugins: nodePolyfills,
-    });
+patch('node_modules/sass/sass.dart.js', {
+  'var self = Object.create(dartNodePreambleSelf);': 'var self = window;',
+}).then(() => {
+  esbuild.build({
+    ...baseOptions,
+    entryPoints: ['vendor_modules/imports/sass.ts'],
+    outfile: 'dist/sass/sass.js',
+    globalName: 'sass',
+    plugins: nodePolyfills,
   });
 });
 
@@ -134,14 +130,21 @@ esbuild.build({
 });
 
 // postcss-preset-env
-esbuild.build({
-  ...baseOptions,
-  entryPoints: ['vendor_modules/imports/postcss-preset-env.ts'],
-  outfile: 'dist/postcss-preset-env/postcss-preset-env.js',
-  globalName: 'postcssPresetEnv',
-  plugins: nodePolyfills,
+patch('node_modules/postcss-custom-properties/dist/index.mjs', {
+  'import{pathToFileURL as r}from"url";': 'const r = (path) => new URL(path, "file:");',
+  'import{promises as s}from"fs";':
+    'const s = { writeFile: async () => {}, readFile: async () => "" };',
+}).then(() => {
+  esbuild.build({
+    ...baseOptions,
+    entryPoints: ['vendor_modules/imports/postcss-preset-env.ts'],
+    outfile: 'dist/postcss-preset-env/postcss-preset-env.js',
+    globalName: 'postcssPresetEnv',
+    plugins: nodePolyfills,
+  });
 });
 
+// @prettier/plugin-pug
 esbuild.buildSync({
   ...baseOptions,
   entryPoints: ['node_modules/@prettier/plugin-pug/dist/index.js'],
@@ -149,15 +152,6 @@ esbuild.buildSync({
   globalName: 'pluginPug',
 });
 
-// solid
-esbuild.build({
-  ...baseOptions,
-  entryPoints: ['vendor_modules/imports/babel-preset-solid.js'],
-  outfile: 'dist/babel-preset-solid/babel-preset-solid.js',
-  globalName: 'babelPresetSolid',
-  plugins: nodePolyfills,
-});
-
 // svelte
 esbuild.buildSync({
   ...baseOptions,
@@ -174,12 +168,25 @@ fs.copyFileSync(
 );
 
 // MDX
+patch('node_modules/@mdx-js/mdx/lib/plugin/recma-document.js', {
+  "import {URL} from 'url'": '',
+}).then(() => {
+  esbuild.build({
+    ...baseOptions,
+    entryPoints: ['vendor_modules/imports/mdx.ts'],
+    outfile: 'dist/mdx/mdx.js',
+    format: 'esm',
+    define: { window: 'globalThis' },
+    plugins: nodePolyfills,
+  });
+});
+
+// remark-gfm
 esbuild.build({
   ...baseOptions,
-  entryPoints: ['vendor_modules/imports/mdx.ts'],
-  outfile: 'dist/mdx/mdx.js',
-  globalName: 'MDX',
-  plugins: nodePolyfills,
+  entryPoints: ['vendor_modules/imports/remark-gfm.js'],
+  outfile: 'dist/remark-gfm/remark-gfm.js',
+  format: 'esm',
 });
 
 // livescript

package/vendor_modules/imports/babel-preset-solid.js

@@ -1,2 +1,2 @@
-import solid from 'babel-preset-solid';
+import solid from 'https://esm.sh/babel-preset-solid@1.3.5';
 export { solid };

package/vendor_modules/imports/mdx.ts

@@ -1,2 +1 @@
-import mdx from '@mdx-js/mdx';
-export { mdx };
+export { compile } from '@mdx-js/mdx';

package/vendor_modules/imports/remark-gfm.js

@@ -0,0 +1,3 @@
+import remarkGfm from 'remark-gfm';
+
+export default remarkGfm;

package/vendor_modules/src/stylus/readme.md

@@ -0,0 +1 @@
+from https://github.com/stylus/stylus-lang.com/blob/gh-pages/try/stylus.min.js