create-rsbuild 0.7.3 → 0.7.4

package/dist/index.js

@@ -38,12 +38,12 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 
-// ../../node_modules/.pnpm/@modern-js+module-tools@2.51.0_eslint@9.4.0_typescript@5.4.5/node_modules/@modern-js/module-tools/shims/esm.js
+// ../../node_modules/.pnpm/@modern-js+module-tools@2.52.0_eslint@9.4.0_typescript@5.4.5/node_modules/@modern-js/module-tools/shims/esm.js
 import { fileURLToPath } from "url";
 import path from "path";
 var getFilename, getDirname, __dirname;
 var init_esm = __esm({
-  "../../node_modules/.pnpm/@modern-js+module-tools@2.51.0_eslint@9.4.0_typescript@5.4.5/node_modules/@modern-js/module-tools/shims/esm.js"() {
+  "../../node_modules/.pnpm/@modern-js+module-tools@2.52.0_eslint@9.4.0_typescript@5.4.5/node_modules/@modern-js/module-tools/shims/esm.js"() {
     "use strict";
     getFilename = () => fileURLToPath(import.meta.url);
     getDirname = () => path.dirname(getFilename());
@@ -223,6 +223,110 @@ var require_picocolors2 = __commonJS({
   }
 });
 
+// ../../node_modules/.pnpm/deepmerge@4.3.1/node_modules/deepmerge/dist/cjs.js
+var require_cjs = __commonJS({
+  "../../node_modules/.pnpm/deepmerge@4.3.1/node_modules/deepmerge/dist/cjs.js"(exports, module) {
+    "use strict";
+    init_esm();
+    var isMergeableObject = function isMergeableObject2(value) {
+      return isNonNullObject(value) && !isSpecial(value);
+    };
+    function isNonNullObject(value) {
+      return !!value && typeof value === "object";
+    }
+    function isSpecial(value) {
+      var stringValue = Object.prototype.toString.call(value);
+      return stringValue === "[object RegExp]" || stringValue === "[object Date]" || isReactElement(value);
+    }
+    var canUseSymbol = typeof Symbol === "function" && Symbol.for;
+    var REACT_ELEMENT_TYPE = canUseSymbol ? Symbol.for("react.element") : 60103;
+    function isReactElement(value) {
+      return value.$$typeof === REACT_ELEMENT_TYPE;
+    }
+    function emptyTarget(val) {
+      return Array.isArray(val) ? [] : {};
+    }
+    function cloneUnlessOtherwiseSpecified(value, options) {
+      return options.clone !== false && options.isMergeableObject(value) ? deepmerge2(emptyTarget(value), value, options) : value;
+    }
+    function defaultArrayMerge(target, source, options) {
+      return target.concat(source).map(function(element) {
+        return cloneUnlessOtherwiseSpecified(element, options);
+      });
+    }
+    function getMergeFunction(key, options) {
+      if (!options.customMerge) {
+        return deepmerge2;
+      }
+      var customMerge = options.customMerge(key);
+      return typeof customMerge === "function" ? customMerge : deepmerge2;
+    }
+    function getEnumerableOwnPropertySymbols(target) {
+      return Object.getOwnPropertySymbols ? Object.getOwnPropertySymbols(target).filter(function(symbol) {
+        return Object.propertyIsEnumerable.call(target, symbol);
+      }) : [];
+    }
+    function getKeys(target) {
+      return Object.keys(target).concat(getEnumerableOwnPropertySymbols(target));
+    }
+    function propertyIsOnObject(object, property) {
+      try {
+        return property in object;
+      } catch (_3) {
+        return false;
+      }
+    }
+    function propertyIsUnsafe(target, key) {
+      return propertyIsOnObject(target, key) && !(Object.hasOwnProperty.call(target, key) && Object.propertyIsEnumerable.call(target, key));
+    }
+    function mergeObject(target, source, options) {
+      var destination = {};
+      if (options.isMergeableObject(target)) {
+        getKeys(target).forEach(function(key) {
+          destination[key] = cloneUnlessOtherwiseSpecified(target[key], options);
+        });
+      }
+      getKeys(source).forEach(function(key) {
+        if (propertyIsUnsafe(target, key)) {
+          return;
+        }
+        if (propertyIsOnObject(target, key) && options.isMergeableObject(source[key])) {
+          destination[key] = getMergeFunction(key, options)(target[key], source[key], options);
+        } else {
+          destination[key] = cloneUnlessOtherwiseSpecified(source[key], options);
+        }
+      });
+      return destination;
+    }
+    function deepmerge2(target, source, options) {
+      options = options || {};
+      options.arrayMerge = options.arrayMerge || defaultArrayMerge;
+      options.isMergeableObject = options.isMergeableObject || isMergeableObject;
+      options.cloneUnlessOtherwiseSpecified = cloneUnlessOtherwiseSpecified;
+      var sourceIsArray = Array.isArray(source);
+      var targetIsArray = Array.isArray(target);
+      var sourceAndTargetTypesMatch = sourceIsArray === targetIsArray;
+      if (!sourceAndTargetTypesMatch) {
+        return cloneUnlessOtherwiseSpecified(source, options);
+      } else if (sourceIsArray) {
+        return options.arrayMerge(target, source, options);
+      } else {
+        return mergeObject(target, source, options);
+      }
+    }
+    deepmerge2.all = function deepmergeAll(array, options) {
+      if (!Array.isArray(array)) {
+        throw new Error("first argument should be an array");
+      }
+      return array.reduce(function(prev, next) {
+        return deepmerge2(prev, next, options);
+      }, {});
+    };
+    var deepmerge_1 = deepmerge2;
+    module.exports = deepmerge_1;
+  }
+});
+
 // src/index.ts
 init_esm();
 import fs from "fs";
@@ -543,6 +647,41 @@ var x = class {
     }
   }
 };
+var pD = Object.defineProperty;
+var fD = (t, u, F) => u in t ? pD(t, u, { enumerable: true, configurable: true, writable: true, value: F }) : t[u] = F;
+var K = (t, u, F) => (fD(t, typeof u != "symbol" ? u + "" : u, F), F);
+var gD = class extends x {
+  constructor(u) {
+    super(u, false), K(this, "options"), K(this, "cursor", 0), this.options = u.options, this.value = [...u.initialValues ?? []], this.cursor = Math.max(this.options.findIndex(({ value: F }) => F === u.cursorAt), 0), this.on("key", (F) => {
+      F === "a" && this.toggleAll();
+    }), this.on("cursor", (F) => {
+      switch (F) {
+        case "left":
+        case "up":
+          this.cursor = this.cursor === 0 ? this.options.length - 1 : this.cursor - 1;
+          break;
+        case "down":
+        case "right":
+          this.cursor = this.cursor === this.options.length - 1 ? 0 : this.cursor + 1;
+          break;
+        case "space":
+          this.toggleValue();
+          break;
+      }
+    });
+  }
+  get _value() {
+    return this.options[this.cursor].value;
+  }
+  toggleAll() {
+    const u = this.value.length === this.options.length;
+    this.value = u ? [] : this.options.map((F) => F.value);
+  }
+  toggleValue() {
+    const u = this.value.includes(this._value);
+    this.value = u ? this.value.filter((F) => F !== this._value) : [...this.value, this._value];
+  }
+};
 var bD = Object.defineProperty;
 var wD = (t, u, F) => u in t ? bD(t, u, { enumerable: true, configurable: true, writable: true, value: F }) : t[u] = F;
 var Z = (t, u, F) => (wD(t, typeof u != "symbol" ? u + "" : u, F), F);
@@ -604,7 +743,7 @@ var H = o("◆", "*");
 var I2 = o("■", "x");
 var x2 = o("▲", "x");
 var S2 = o("◇", "o");
-var K = o("┌", "T");
+var K2 = o("┌", "T");
 var a2 = o("│", "|");
 var d2 = o("└", "—");
 var b2 = o("●", ">");
@@ -683,6 +822,50 @@ ${import_picocolors2.default.cyan(d2)}
     }
   } }).prompt();
 };
+var ae = (r2) => {
+  const n = (i, t) => {
+    const s = i.label ?? String(i.value);
+    return t === "active" ? `${import_picocolors2.default.cyan(C)} ${s} ${i.hint ? import_picocolors2.default.dim(`(${i.hint})`) : ""}` : t === "selected" ? `${import_picocolors2.default.green(w2)} ${import_picocolors2.default.dim(s)}` : t === "cancelled" ? `${import_picocolors2.default.strikethrough(import_picocolors2.default.dim(s))}` : t === "active-selected" ? `${import_picocolors2.default.green(w2)} ${s} ${i.hint ? import_picocolors2.default.dim(`(${i.hint})`) : ""}` : t === "submitted" ? `${import_picocolors2.default.dim(s)}` : `${import_picocolors2.default.dim(M2)} ${import_picocolors2.default.dim(s)}`;
+  };
+  return new gD({ options: r2.options, initialValues: r2.initialValues, required: r2.required ?? true, cursorAt: r2.cursorAt, validate(i) {
+    if (this.required && i.length === 0)
+      return `Please select at least one option.
+${import_picocolors2.default.reset(import_picocolors2.default.dim(`Press ${import_picocolors2.default.gray(import_picocolors2.default.bgWhite(import_picocolors2.default.inverse(" space ")))} to select, ${import_picocolors2.default.gray(import_picocolors2.default.bgWhite(import_picocolors2.default.inverse(" enter ")))} to submit`))}`;
+  }, render() {
+    let i = `${import_picocolors2.default.gray(a2)}
+${y2(this.state)}  ${r2.message}
+`;
+    switch (this.state) {
+      case "submit":
+        return `${i}${import_picocolors2.default.gray(a2)}  ${this.options.filter(({ value: t }) => this.value.includes(t)).map((t) => n(t, "submitted")).join(import_picocolors2.default.dim(", ")) || import_picocolors2.default.dim("none")}`;
+      case "cancel": {
+        const t = this.options.filter(({ value: s }) => this.value.includes(s)).map((s) => n(s, "cancelled")).join(import_picocolors2.default.dim(", "));
+        return `${i}${import_picocolors2.default.gray(a2)}  ${t.trim() ? `${t}
+${import_picocolors2.default.gray(a2)}` : ""}`;
+      }
+      case "error": {
+        const t = this.error.split(`
+`).map((s, c2) => c2 === 0 ? `${import_picocolors2.default.yellow(d2)}  ${import_picocolors2.default.yellow(s)}` : `   ${s}`).join(`
+`);
+        return i + import_picocolors2.default.yellow(a2) + "  " + this.options.map((s, c2) => {
+          const l2 = this.value.includes(s.value), u = c2 === this.cursor;
+          return u && l2 ? n(s, "active-selected") : l2 ? n(s, "selected") : n(s, u ? "active" : "inactive");
+        }).join(`
+${import_picocolors2.default.yellow(a2)}  `) + `
+` + t + `
+`;
+      }
+      default:
+        return `${i}${import_picocolors2.default.cyan(a2)}  ${this.options.map((t, s) => {
+          const c2 = this.value.includes(t.value), l2 = s === this.cursor;
+          return l2 && c2 ? n(t, "active-selected") : c2 ? n(t, "selected") : n(t, l2 ? "active" : "inactive");
+        }).join(`
+${import_picocolors2.default.cyan(a2)}  `)}
+${import_picocolors2.default.cyan(d2)}
+`;
+    }
+  } }).prompt();
+};
 var R2 = (r2) => r2.replace(me(), "");
 var le = (r2 = "", n = "") => {
   const i = `
@@ -712,6 +895,9 @@ function me() {
   return new RegExp(r2, "g");
 }
 
+// src/index.ts
+var import_deepmerge = __toESM(require_cjs());
+
 // ../../node_modules/.pnpm/rslog@1.2.2/node_modules/rslog/dist/index.mjs
 init_esm();
 import process2 from "process";
@@ -1003,6 +1189,7 @@ function checkCancel(value) {
   if (hD(value)) {
     cancelAndExit();
   }
+  return value;
 }
 function formatTargetDir(targetDir) {
   return targetDir.trim().replace(/\/+$/g, "");
@@ -1030,57 +1217,74 @@ async function main() {
   const packageRoot = path2.resolve(__dirname, "..");
   const packageJsonPath = path2.join(packageRoot, "package.json");
   const { version } = __require(packageJsonPath);
-  let targetDir = await te({
-    message: "Input target folder",
-    placeholder: "my-project",
-    validate(value) {
-      if (value.length === 0) {
-        return "Target folder is required";
+  let targetDir = checkCancel(
+    await te({
+      message: "Input target folder",
+      placeholder: "my-project",
+      validate(value) {
+        if (value.length === 0) {
+          return "Target folder is required";
+        }
       }
-    }
-  });
-  checkCancel(targetDir);
+    })
+  );
   targetDir = formatTargetDir(targetDir);
   const distFolder = path2.join(cwd, targetDir);
   if (fs.existsSync(distFolder) && !isEmptyDir(distFolder)) {
-    const option = await ie({
-      message: `"${targetDir}" is not empty, please choose:`,
-      options: [
-        { value: "yes", label: "Continue and override files" },
-        { value: "no", label: "Cancel operation" }
-      ]
-    });
-    checkCancel(option);
+    const option = checkCancel(
+      await ie({
+        message: `"${targetDir}" is not empty, please choose:`,
+        options: [
+          { value: "yes", label: "Continue and override files" },
+          { value: "no", label: "Cancel operation" }
+        ]
+      })
+    );
     if (option === "no") {
       cancelAndExit();
     }
   }
-  const framework = await ie({
-    message: "Select framework",
-    options: [
-      { value: "react", label: "React" },
-      { value: "vue3", label: "Vue 3" },
-      { value: "vue2", label: "Vue 2" },
-      { value: "lit", label: "Lit" },
-      { value: "preact", label: "Preact" },
-      { value: "svelte", label: "Svelte" },
-      { value: "solid", label: "Solid" },
-      { value: "vanilla", label: "Vanilla" }
-    ]
-  });
-  checkCancel(framework);
-  const language = await ie({
-    message: "Select language",
-    options: [
-      { value: "ts", label: "TypeScript" },
-      { value: "js", label: "JavaScript" }
-    ]
-  });
-  checkCancel(language);
+  const framework = checkCancel(
+    await ie({
+      message: "Select framework",
+      options: [
+        { value: "react", label: "React" },
+        { value: "vue3", label: "Vue 3" },
+        { value: "vue2", label: "Vue 2" },
+        { value: "lit", label: "Lit" },
+        { value: "preact", label: "Preact" },
+        { value: "svelte", label: "Svelte" },
+        { value: "solid", label: "Solid" },
+        { value: "vanilla", label: "Vanilla" }
+      ]
+    })
+  );
+  const language = checkCancel(
+    await ie({
+      message: "Select language",
+      options: [
+        { value: "ts", label: "TypeScript" },
+        { value: "js", label: "JavaScript" }
+      ]
+    })
+  );
+  const tools = checkCancel(
+    await ae({
+      message: "Select additional tools (use arrow keys / space bar)",
+      options: [
+        { value: "biome", label: "Add Biome for code linting and formatting" },
+        { value: "prettier", label: "Add Prettier for code formatting" }
+      ]
+    })
+  );
   const srcFolder = path2.join(packageRoot, `template-${framework}-${language}`);
   const commonFolder = path2.join(packageRoot, "template-common");
   copyFolder(commonFolder, distFolder, version);
   copyFolder(srcFolder, distFolder, version, path2.basename(targetDir));
+  for (const tool of tools) {
+    const toolFolder = path2.join(packageRoot, `template-${tool}`);
+    copyFolder(toolFolder, distFolder, version);
+  }
   const nextSteps = [
     `cd ${targetDir}`,
     `${pkgManager} i`,
@@ -1089,6 +1293,31 @@ async function main() {
   le(nextSteps.join("\n"), "Next steps");
   $e("Done.");
 }
+function sortObjectKeys(obj) {
+  const sortedKeys = Object.keys(obj).sort();
+  const sortedObj = {};
+  for (const key of sortedKeys) {
+    sortedObj[key] = obj[key];
+  }
+  return sortedObj;
+}
+function mergePackageJson(targetPackage, extraPackage) {
+  if (!fs.existsSync(targetPackage)) {
+    return;
+  }
+  const content = (0, import_deepmerge.default)(
+    JSON.parse(fs.readFileSync(targetPackage, "utf-8")),
+    JSON.parse(fs.readFileSync(extraPackage, "utf-8"))
+  );
+  for (const key of ["scripts", "dependencies", "devDependencies"]) {
+    if (!(key in content)) {
+      continue;
+    }
+    content[key] = sortObjectKeys(content[key]);
+  }
+  fs.writeFileSync(targetPackage, `${JSON.stringify(content, null, 2)}
+`);
+}
 function copyFolder(src, dist, version, name) {
   const renameFiles = {
     gitignore: ".gitignore"
@@ -1104,6 +1333,9 @@ function copyFolder(src, dist, version, name) {
     const stat = fs.statSync(srcFile);
     if (stat.isDirectory()) {
       copyFolder(srcFile, distFile, version);
+    } else if (file === "extra-package.json") {
+      const targetPackage = path2.resolve(dist, "package.json");
+      mergePackageJson(targetPackage, srcFile);
     } else {
       fs.copyFileSync(srcFile, distFile);
       if (file === "package.json") {
@@ -1116,8 +1348,9 @@ var updatePackageJson = (pkgJsonPath, version, name) => {
   let content = fs.readFileSync(pkgJsonPath, "utf-8");
   content = content.replace(/workspace:\*/g, `^${version}`);
   const pkg = JSON.parse(content);
-  if (name)
+  if (name && name !== ".") {
     pkg.name = name;
+  }
   fs.writeFileSync(pkgJsonPath, JSON.stringify(pkg, null, 2));
 };
 main();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-rsbuild",
-  "version": "0.7.3",
+  "version": "0.7.4",
   "description": "Create a new Rsbuild project",
   "homepage": "https://rsbuild.dev",
   "repository": {
@@ -28,6 +28,7 @@
   "devDependencies": {
     "@clack/prompts": "^0.7.0",
     "@types/node": "18.x",
+    "deepmerge": "^4.3.1",
     "rslog": "^1.2.2",
     "typescript": "^5.4.2"
   },

package/template-biome/biome.json

@@ -0,0 +1,25 @@
+{
+  "$schema": "https://biomejs.dev/schemas/1.8.0/schema.json",
+  "organizeImports": {
+    "enabled": true
+  },
+  "vcs": {
+    "enabled": true,
+    "clientKind": "git",
+    "useIgnoreFile": true
+  },
+  "formatter": {
+    "indentStyle": "space"
+  },
+  "javascript": {
+    "formatter": {
+      "quoteStyle": "single"
+    }
+  },
+  "linter": {
+    "enabled": true,
+    "rules": {
+      "recommended": true
+    }
+  }
+}

package/template-biome/extra-package.json

@@ -0,0 +1,9 @@
+{
+  "scripts": {
+    "check": "biome check --write",
+    "format": "biome format --write"
+  },
+  "devDependencies": {
+    "@biomejs/biome": "^1.8.0"
+  }
+}

package/template-preact-ts/src/index.tsx

@@ -1,4 +1,7 @@
 import { render } from 'preact';
 import App from './App';
 
-render(<App />, document.getElementById('root')!);
+const root = document.getElementById('root');
+if (root) {
+  render(<App />, root);
+}

package/template-prettier/.prettierrc

@@ -0,0 +1,3 @@
+{
+	"singleQuote": true
+}

package/template-prettier/extra-package.json

@@ -0,0 +1,8 @@
+{
+  "scripts": {
+    "format": "prettier --write ."
+  },
+  "devDependencies": {
+    "prettier": "^3.1.1"
+  }
+}

package/template-react-ts/src/index.tsx

@@ -2,9 +2,12 @@ import React from 'react';
 import ReactDOM from 'react-dom/client';
 import App from './App';
 
-const root = ReactDOM.createRoot(document.getElementById('root')!);
-root.render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>,
-);
+const rootEl = document.getElementById('root');
+if (rootEl) {
+  const root = ReactDOM.createRoot(rootEl);
+  root.render(
+    <React.StrictMode>
+      <App />
+    </React.StrictMode>,
+  );
+}

package/template-solid-ts/src/index.tsx

@@ -1,4 +1,7 @@
 import { render } from 'solid-js/web';
 import App from './App';
 
-render(() => <App />, document.getElementById('root')!);
+const root = document.getElementById('root');
+if (root) {
+  render(() => <App />, root);
+}

package/template-svelte-js/src/index.js

@@ -3,9 +3,6 @@ import './index.css';
 
 const app = new App({
   target: document.body,
-  props: {
-    name: 'world',
-  },
 });
 
 export default app;

package/template-svelte-ts/package.json

@@ -5,7 +5,8 @@
   "scripts": {
     "dev": "rsbuild dev --open",
     "build": "rsbuild build",
-    "preview": "rsbuild preview"
+    "preview": "rsbuild preview",
+    "svelte-check": "svelte-check --tsconfig ./tsconfig.json"
   },
   "dependencies": {
     "svelte": "^4.2.17"
@@ -13,6 +14,7 @@
   "devDependencies": {
     "@rsbuild/core": "workspace:*",
     "@rsbuild/plugin-svelte": "workspace:*",
+    "svelte-check": "^3.8.0",
     "typescript": "^5.4.2"
   }
 }

package/template-svelte-ts/src/index.ts

@@ -3,9 +3,6 @@ import './index.css';
 
 const app = new App({
   target: document.body,
-  props: {
-    name: 'world',
-  },
 });
 
 export default app;