Merge pull request #438 from nyaggah/develop

Develop
nyaggah · May 18, 2024 · 47ed35d · 47ed35d
2 parents 4155e65 + 9367af8
commit 47ed35d
Show file tree

Hide file tree

Showing 17 changed files with 1,303 additions and 1,206 deletions.
diff --git a/.changeset/brown-lies-trade.md b/.changeset/brown-lies-trade.md
@@ -0,0 +1,12 @@
+---
+"@bedframe/cli": patch
+"@bedframe/core": patch
+"create-bedframe": patch
+"eslint-config-bedframe": patch
+---
+
+- feat(create-bedframe): output standalone make command + update bin
+- feat(cli-commands): ensure build and dev scripts have desc of options/args (browser array)
+- code clean up
+- remove codemod command <~~ CRX handles Firefox builds now aka Bedframe supports Firefox/Safari + All chromium (Arc, Brave, Chrome, Edge, Opera,...)
+- update packages to latest
diff --git a/package.json b/package.json
@@ -24,25 +24,25 @@
     "prepare": "husky install"
   },
   "devDependencies": {
-    "@changesets/cli": "^2.27.1",
-    "@commitlint/cli": "^18.6.1",
-    "@commitlint/config-conventional": "^18.6.3",
+    "@changesets/cli": "^2.27.2",
+    "@commitlint/cli": "^19.3.0",
+    "@commitlint/config-conventional": "^19.2.2",
     "@types/chrome": "^0.0.268",
-    "@types/node": "^20.12.11",
+    "@types/node": "^20.12.12",
     "@types/prompts": "^2.4.9",
     "commitizen": "^4.3.0",
     "cz-conventional-changelog": "^3.3.0",
-    "eslint": "^8.57.0",
+    "eslint": "^9.3.0",
     "eslint-config-bedframe": "workspace:^",
     "eslint-config-prettier": "^9.1.0",
-    "husky": "^8.0.3",
+    "husky": "^9.0.11",
     "lint-staged": "^15.2.2",
     "prettier": "^3.2.5",
     "rollup": "^4.17.2",
     "shx": "^0.3.4",
     "ts-node": "^10.9.2",
     "tslib": "^2.6.2",
-    "tsx": "^3.14.0",
+    "tsx": "^4.10.5",
     "turbo": "^1.13.3",
     "typescript": "^5.4.5"
   },

diff --git a/packages/cli/README.md b/packages/cli/README.md
@@ -37,11 +37,14 @@ The Bedframe Command Line Interface (CLI) lets you make and manage your BED dire
 
 <blockquote><br />
   <h4><strong>Node Version Requirement</strong></h4>  
-  Bedframe CLI requires <a href="https://nodejs.org/" target="_blank" rel="noopener noreferrer">Node.js</a> 16+. You can manage multiple versions of Node on the same machine with <a href="https://github.com/tj/n" target="_blank" rel="noopener noreferrer">n</a>, <a href="https://github.com/creationix/nvm" target="_blank" rel="noopener noreferrer">nvm</a> or <a href="https://github.com/coreybutler/nvm-windows" target="_blank" rel="noopener noreferrer">nvm-windows</a>.
+  Bedframe CLI requires <a href="https://nodejs.org/" target="_blank" rel="noopener noreferrer">Node.js</a> version 18+. 20+. You can manage multiple versions of Node on the same machine with <a href="https://github.com/tj/n" target="_blank" rel="noopener noreferrer">n</a>, <a href="https://github.com/creationix/nvm" target="_blank" rel="noopener noreferrer">nvm</a> or <a href="https://github.com/coreybutler/nvm-windows" target="_blank" rel="noopener noreferrer">nvm-windows</a>.
   <br /><br />
 </blockquote>
 
 ```bash
+#  with bun
+bun add @bedframe/cli -g
+
 #  with pnpm
 pnpm add @bedframe/cli -g
 
@@ -62,29 +65,28 @@ After installation, you will have access to the `bedframe` executable in your co
   D E V E L O P M E N T
   F R A M E W O R K
 
+  @bedframe/cli v0.0.78
+
+
 Usage: @bedframe/cli [options] [command]
 
 Bedframe CLI - your Browser Extension Development framework (dev utility)
 
 Options:
-  -V, --version                output the version number
-  -h, --help                   display help for command
+  -V, --version             output the version number
+  -h, --help                display help for command
 
 Commands:
-  make [options] [name]        make your B E D
-  version [options]            create or update git release of current version
-                               (changeset version)
-  publish [options]            • publish new or update existing extension(s)
-                               ├ • C W S: Chrome Web Store
-                               ├ • A M O: Mozilla/Firefox Add-ons
-                               └ • M E A: MS Edge Add-ons
-  dev [browsers]               start Vite dev server for one or more browsers
-                               concurrently
-  build [browsers]             generate prod builds for 1 or more browsers concurrently
-  codemod [options] <browser>  perform after-build manifest and features code mods (🍝)
-                               by browser
-  zip [options] [browsers]     zip browser dist directories
-  help [command]               display help for command
+  make [options] [name]     make your B E D
+  version [options]         create or update git release of current version (changeset version)
+  publish [options]         publish new or update existing extension(s)
+                            - chrome: Chrome Web Store (C W S)
+                            - firefox: Mozilla/Firefox Add-ons (A M O)
+                            - edge: MS Edge Add-ons (M E A)
+  dev [browsers]            start Vite dev server for one or more browsers concurrently
+  build [browsers]          generate prod builds for 1 or more browsers concurrently
+  zip [options] [browsers]  zip browser dist directories
+  help [command]            display help for command
 ```
 
 You can check you have the right version with this command:
@@ -134,13 +136,17 @@ Alternatively: this command is also available as the standalone [`create-bedfram
 <summary>Command Details</summary>
 
 ```bash
+
 >_
 
   B R O W S E R
   E X T E N S I O N
   D E V E L O P M E N T
   F R A M E W O R K
 
+  @bedframe/cli v0.0.78
+
+
 Usage: @bedframe/cli make [options] [name]
 
 make your B E D
@@ -149,28 +155,26 @@ Arguments:
   name                                   project name
 
 Options:
-  -b, --browsers <browsers>              specify comma-separated list browsers (chrome, edge,
-                                         firefox)
-  -v, --version <version>                specify project version (0.0.1)
-  -d, --description <description>        specify project description
-  -a, --author <author>                  specify project author  (name, email, url)
-  --license <license>                    specify project license (MIT)
-  -p, --private                          specify visibility of project (true)
-  -t, --type <type>                      specify extension type (popup)
-  --position <position>                  specify overlay extension position (center)
-  --override <override>                  specify page to override (newtab)
-  --options <options>                    specify whether to and how render options (embedded)
-  -p, --packageManager <packageManager>  Specify package manager to use (pnpm)
-  -f, --framework <framework>        specify framework to use (react)
-  -l, --language <language>              specify language to use (typescript)
-  -s, --style <style>                    specify CSS framework to use (tailwind)
+  -b, --browsers <browsers>              comma-separated list browsers (chrome, edge, firefox, etc)
+  -v, --version <version>                project version (0.0.1)
+  -d, --description <description>        project description
+  -a, --author <author>                  project author  (name, email, url)
+  --license <license>                    project license (MIT)
+  -r, --private                          visibility of project (true)
+  -t, --type <type>                      extension type (popup)
+  --override <override>                  page to override (newtab)
+  --options <options>                    whether to and how render options (embedded)
+  -p, --packageManager <packageManager>  package manager to use (pnpm)
+  -f, --framework <framework>            framework to use (react)
+  -l, --language <language>              language to use (typescript)
+  -s, --style <style>                    css framework to use (tailwind)
   -o, --lintFormat                       add linting with formatting (true)
-  -t, --tests                            add tests (vitest + testing library) (true)
+  -e, --tests                            add tests (vitest + testing library) (true)
   -g, --git                              initialize git for source control (true)
-  -h, --gitHooks                         add git hooks (true)
-  -c, --commitLint                       add commit linting (true)
-  -x, --changesets                       add changesets (true)
-  -i, --installDeps                      add & install dependencies (true)
+  -h, --gitHooks                         use git hooks (true)
+  -c, --commitLint                       use commit linting (true)
+  -x, --changesets                       use changesets (true)
+  -i, --installDeps                      install dependencies (true)
   -y, --yes                              make your BED w/ preconfigured defaults (false)
   --help                                 display help for command
 ```
@@ -427,37 +431,6 @@ alias for vite build w/ --mode &lt;browser&gt;
 
 </details>
 
-### C O D E M O D
-
-perform after-build manifest and features code mods
-
-<details>
-  <summary>Command Details</summary>
-
-```bash
->_
-
-B R O W S E R
-E X T E N S I O N
-D E V E L O P M E N T
-F R A M E W O R K
-
-Usage: @bedframe/cli codemod [options] <browser>
-
-perform after-build manifest and features code mods (🍝) by browser
-
-Arguments:
-browser browser name
-
-Options:
---manifest perform manifest.json codemods (default: true)
---features perform in-code features codemods (default: true)
--h, --help display help for command
-
-```
-
-</details>
-
 ### Z I P
 
 create zip archive(s) for 1 or more browsers

diff --git a/packages/cli/package.json b/packages/cli/package.json
@@ -19,7 +19,8 @@
     }
   },
   "bin": {
-    "bedframe": "./dist/bedframe.js"
+    "bedframe": "./dist/bedframe.js",
+    "create-bedframe": "./dist/create-bedframe.js"
   },
   "files": [
     "/dist",
@@ -36,7 +37,7 @@
   },
   "dependencies": {
     "@bedframe/core": "workspace:*",
-    "commander": "^12.0.0",
+    "commander": "^12.1.0",
     "execa": "^8.0.1",
     "kolorist": "^1.8.0",
     "listr": "^0.14.3",
@@ -53,20 +54,20 @@
     "@rollup/plugin-typescript": "^11.1.6",
     "@types/chrome": "^0.0.268",
     "@types/listr": "^0.14.9",
-    "@types/node": "^20.12.11",
+    "@types/node": "^20.12.12",
     "@types/prompts": "^2.4.9",
-    "@typescript-eslint/eslint-plugin": "^7.8.0",
+    "@typescript-eslint/eslint-plugin": "^7.9.0",
     "concurrently": "^8.2.2",
     "eslint-config-bedframe": "workspace:^",
     "eslint-config-turbo": "^1.13.3",
     "rollup": "^4.17.2",
     "rollup-plugin-copy": "^3.5.0",
-    "rollup-plugin-dts": "^6.1.0",
+    "rollup-plugin-dts": "^6.1.1",
     "rollup-plugin-esbuild": "^6.1.1",
     "rollup-plugin-string": "^3.0.0",
     "ts-node": "^10.9.2",
     "tsconfig-paths": "^4.2.0",
-    "tsx": "^4.7.1",
+    "tsx": "^4.10.5",
     "typescript": "^5.4.5"
   },
   "lint-staged": {

diff --git a/packages/cli/rollup.config.js b/packages/cli/rollup.config.js
@@ -10,7 +10,6 @@ const name = `dist/bedframe`
 
 const bundle = (config) => ({
   ...config,
-  input: 'src/index.ts',
   external: (id) => !/^[./]/.test(id),
   plugins: [
     nodeResolve(),
@@ -24,6 +23,7 @@ const bundle = (config) => ({
 
 export default [
   bundle({
+    input: 'src/index.ts',
     plugins: [
       esbuild(),
       string({
@@ -40,6 +40,24 @@ export default [
     ],
   }),
   bundle({
+    input: 'src/create-bedframe.ts',
+    plugins: [
+      esbuild(),
+      string({
+        include: `dist/create-bedframe.js`,
+      }),
+    ],
+    output: [
+      {
+        file: `dist/create-bedframe.js`,
+        format: 'es',
+        sourcemap: true,
+        banner: '#!/usr/bin/env node\n',
+      },
+    ],
+  }),
+  bundle({
+    input: 'src/index.ts',
     plugins: [
       dts({
         insertTypesEntry: true,

diff --git a/packages/cli/src/commands/build.ts b/packages/cli/src/commands/build.ts
@@ -62,7 +62,7 @@ ${dim('└')} dist${dim('/')}${browsers
 export const buildCommand = new Command('build')
   .command('build')
   .description('generate prod builds for 1 or more browsers concurrently')
-  .arguments('[browsers]')
+  .argument('[browsers]', 'list of browser names')
   .action(async (browser) => {
     const browserArray = getBrowserArray()
     let cliBrowsers: AnyCase<Browser>[] = []

diff --git a/packages/cli/src/commands/buildCommand.ts b/packages/cli/src/commands/buildCommand.ts
@@ -5,7 +5,7 @@ import { executeBuildScript } from './build'
 export const buildCommand = new Command('build')
   .command('build')
   .description('generate prod builds for 1 or more browsers concurrently')
-  .arguments('[browsers]')
+  .argument('[browsers]', 'list of browser names')
   .action(async (browser) => {
     const browserArray = getBrowserArray()
     executeBuildScript(!browser ? browserArray : browser)

diff --git a/packages/cli/src/commands/dev.ts b/packages/cli/src/commands/dev.ts
@@ -90,7 +90,7 @@ ${dim('└')} dist${dim('/')}${browsers
 export const devCommand = new Command('dev')
   .command('dev')
   .description('start Vite dev server for one or more browsers concurrently')
-  .arguments('[browsers]')
+  .argument('[browsers]', 'list of browser names')
   .action(async (browser) => {
     const browserArray = getBrowserArray()
     let cliBrowsers: AnyCase<Browser>[] = []

diff --git a/packages/cli/src/commands/make.ts b/packages/cli/src/commands/make.ts
@@ -63,8 +63,6 @@ makeCommand
         name: basename(cwd()),
         path: cwd(),
       }
-      // ^^^ TO diddly DO: don't we already have a formatProjectName func ??
-      // use that else... its off to 🍝-ville!
     }
     const projectName = name ? name : undefined
     bedframePrompts(projectName, options).then(async (response) => {

diff --git a/packages/cli/src/commands/zip.ts b/packages/cli/src/commands/zip.ts
@@ -38,9 +38,7 @@ function executeZipCommand(browser: any, options: any): void {
   execa(command, { shell: true, stdio: 'inherit' })
     .then(() => {
       console.log(`• successfully zipped ${lightGreen(basename(sourceDir))} 🚀
-└ • browser: ${dim('./dist/')}${lightMagenta(
-        `${process.env.PACKAGE_NAME ?? pkg?.name}`,
-      )}
+└ • browser: ${dim('./dist/')}${lightMagenta(browser.toLowerCase())}
   • archive: ${dim('./dist/')}${lightYellow(`${basename(zipPath)}`)}
   • version: ${lightCyan(`${process.env.PACKAGE_VERSION ?? pkg?.version}`)}
   • date/time: ${lightCyan(new Date().toLocaleString().replace(',', ''))}

diff --git a/packages/cli/src/create-bedframe.ts b/packages/cli/src/create-bedframe.ts
@@ -0,0 +1,26 @@
+import { execSync } from 'node:child_process'
+import path, { resolve } from 'node:path'
+import url from 'node:url'
+
+/**
+ * Standalone `@bedframe/cli` Make command
+ * exposes the `create-bedfame` executable
+ * Lets you perform underlying `npm init bedframe`
+ *
+ * ```bash
+ * npx create bedframe
+ * ```
+ *
+ */
+export function createBedframeCommand(): void {
+  const __dirname = path.dirname(url.fileURLToPath(import.meta.url))
+  const bedframeScriptPath = resolve(__dirname, './bedframe.js')
+
+  try {
+    execSync(`node ${bedframeScriptPath} make`, { stdio: 'inherit' })
+  } catch (error) {
+    console.error('Failed to execute [bedframe make] command:', error)
+  }
+}
+
+createBedframeCommand()
diff --git a/packages/cli/src/lib/make/utils/write-package-json.ts b/packages/cli/src/lib/make/utils/write-package-json.ts
@@ -38,7 +38,7 @@ export function writePackageJson(response: prompts.Answers<string>): void {
   const pmRun = pm !== 'yarn' ? `${pm} run` : pm
 
   const packageJson = `{
-  "name": "${projectName}",
+  "name": "${parameterizeString(projectName)}",
   "version": "${projectVersion}",
   "description": "${projectDescription}",
   ${
@@ -250,3 +250,7 @@ ${
   const destinationPackageJson = path.join(destinationRoot, 'package.json')
   writeFile(destinationPackageJson, packageJson + '\n').catch(console.error)
 }
+
+export const parameterizeString = (string: string, separator = '-') => {
+  return string.toLowerCase().replace(/[^A-Z0-9]/gi, separator)
+}