create-blocklet 0.3.4 → 0.3.7

package/README.md

@@ -36,6 +36,8 @@ Currently supported template presets include:
 - `react`
 - `vue3 + vite`
 - `vue2 + @vue/cli`
+- `next.js`
+- `react + gunjs`
 
 **static**
 
@@ -44,6 +46,9 @@ Currently supported template presets include:
 - `vue2 + @vue/cli`
 - `blocklet page`
 
+**api**
+- `express`
+
 ## Community Templates
 
 create-blocklet is a tool to quickly start a blocklet from a basic template for popular frameworks. You can use a tool like [degit](https://github.com/Rich-Harris/degit) to scaffold your blocklet with github repository template.
@@ -61,3 +66,12 @@ If the blocklet uses `main` as the default branch, suffix the blocklet repo with
 ```bash
 npx degit user/blocklet#main my-blocklet
 ```
+
+## Development
+Use `node /pathToCreateBlockletRepo/index.js` to create a blocklet, or you can use
+``` bash
+ln -s /pathToCreateBlockletRepo/index.js /usr/local/bin/cb
+
+cb
+```
+to create a blocklet

package/common/.prettierrc

@@ -3,7 +3,7 @@
   "useTabs": false,
   "tabWidth": 2,
   "trailingComma": "es5",
-  "jsxBracketSameLine": true,
+  "bracketSameLine": true,
   "semi": true,
   "singleQuote": true
 }

package/index.js

@@ -15,7 +15,7 @@ import { checkServerInstalled, checkServerRunning, checkSatisfiedVersion, getSer
 import { toBlockletDid } from './lib/did.js';
 import { initGitRepo } from './lib/git.js';
 
-const { yellow, red, green, cyan, blue, bold, dim } = chalk;
+const { yellow, red, green, cyan, blue, bold } = chalk;
 
 const __dirname = path.dirname(fileURLToPath(import.meta.url));
 
@@ -46,6 +46,11 @@ const TYPES = [
         display: 'next.js',
         color: blue,
       },
+      {
+        name: 'react-gun',
+        display: 'react + gunjs',
+        color: blue,
+      },
     ],
   },
   {
@@ -229,15 +234,16 @@ async function init() {
 
   const scaffoldSpinner = ora('Creating project...').start();
 
-  const templateDir = path.join(__dirname, `template-${type}/${framework}`);
+  const templateDir = path.join(__dirname, `templates/${framework}-${type}`);
   const name = packageName || targetDir;
 
+  // TODO: 需要把 common file copy 的逻辑移除，不同的 template 之间的差异越来越多，就会需要越来越多特殊处理的代码，违背了初衷，移除这部分逻辑可能是更好的选择
   // copy common files
   (() => {
     const commonDir = path.join(__dirname, 'common');
     const commonFiles = fs.readdirSync(commonDir);
     for (const file of commonFiles) {
-      if (framework !== 'react' && file === '_eslintrc.js') {
+      if (!['react', 'react-gun'].includes(framework) && file === '_eslintrc.js') {
         // eslint-disable-next-line no-continue
         continue;
       }
@@ -417,11 +423,10 @@ async function init() {
     }
 
     if (!hasStart) {
-      console.log(dim('\n  start it later by:\n'));
+      // console.log(dim('\n  start it later by:\n'));
       if (root !== cwd) console.log(blue(`  cd ${bold(related)}`));
 
       console.log(blue(`  ${defaultAgent === 'yarn' ? 'yarn' : `${defaultAgent} install`}`));
-      console.log(blue(`  ${defaultAgent === 'yarn' ? 'yarn dev' : `${defaultAgent} run dev`}`));
       console.log(cyan('blocklet dev'));
       console.log('\n', `Find more usage in ${green('README.md')}`, '\n');
     }

package/lib/git.js

@@ -1,7 +1,18 @@
-import { $, which, cd } from 'zx';
+import { $, which, cd, chalk } from 'zx';
+
+const { yellow } = chalk;
 
 $.verbose = false;
 
+async function canInitGit() {
+  const isInstalled = await isGitInstalled();
+  const gitInfo = await getUserInfo();
+  if (isInstalled && gitInfo.name && gitInfo.email) {
+    return true;
+  }
+  return false;
+}
+
 export async function isGitInstalled() {
   try {
     await which('git');
@@ -12,10 +23,15 @@ export async function isGitInstalled() {
 }
 
 export async function initGitRepo(root) {
-  await cd(root);
-  await $`git init`;
-  await $`git add .`;
-  await $`git commit -m 'init'`;
+  const canInstalled = await canInitGit();
+  if (canInstalled) {
+    await cd(root);
+    await $`git init`;
+    await $`git add .`;
+    await $`git commit -m 'init'`;
+  } else {
+    console.warn(`${yellow('Git is not installed')}`);
+  }
 }
 
 export async function getUserInfo() {

package/lib/index.js

@@ -11,9 +11,14 @@ export async function getOutput(cmd) {
 }
 
 export async function getUser() {
+  function purifyString(str) {
+    return [undefined, 'undefined', null, 'null'].includes(str) ? '' : str;
+  }
+
   const [npmAuthor, gitUser, serverUser] = await Promise.all([getAuthor(), getUserInfo(), getServerUserInfo()]);
-  return {
-    name: serverUser.name || npmAuthor.name || gitUser.name || '',
-    email: serverUser.email || npmAuthor.email || gitUser.email || '',
+  const info = {
+    name: purifyString(serverUser.name) || purifyString(npmAuthor.name) || purifyString(gitUser.name) || '',
+    email: purifyString(serverUser.email) || purifyString(npmAuthor.email) || purifyString(gitUser.email) || '',
   };
+  return info;
 }

package/lib/npm.js

@@ -8,7 +8,7 @@ export async function getAuthor() {
     const { stdout: name } = await $`npm config get init.author.name`;
     const { stdout: email } = await $`npm config get init.author.email`;
 
-    return { name: name.trim(), email: email.trim() };
+    return { name: name?.trim(), email: email?.trim() };
   } catch {
     return {
       name: '',

package/lib/server.js

@@ -3,6 +3,10 @@ import semver from 'semver';
 
 $.verbose = false;
 
+function trimServerOutputVersion(output = '') {
+  return output?.replace(/blocklet \S+ v\d+\.\d+\.\d\n+/g, '');
+}
+
 export async function checkServerInstalled() {
   try {
     await which('blocklet');
@@ -13,8 +17,12 @@ export async function checkServerInstalled() {
 }
 
 export async function getServerVersion() {
-  const { stdout: output } = await $`blocklet --version`;
-  return output.trim();
+  try {
+    const { stdout: output } = await $`blocklet --version`;
+    return output.trim();
+  } catch (e) {
+    return '0.0.0';
+  }
 }
 
 export async function getServerStatus() {
@@ -38,25 +46,29 @@ export async function checkSatisfiedVersion() {
 }
 
 export async function getServerDirectory() {
-  const { stdout: output } = await $`blocklet server status`;
-  const [matchStr] = output.match(/Blocklet Server Data Directory:[\s\S]*?\n/gm) || [];
-  if (!matchStr) return null;
+  try {
+    const { stdout: output } = await $`blocklet server status`;
+    const [matchStr] = output.match(/Blocklet Server Data Directory:[\s\S]*?\n/gm) || [];
+    if (!matchStr) return null;
 
-  const directory = matchStr.replace(/Blocklet Server Data Directory:[\s]*([\S]+)\/\.abtnode\n/gm, '$1');
-  return directory;
+    const directory = matchStr.replace(/Blocklet Server Data Directory:[\s]*([\S]+)\/\.abtnode\n/gm, '$1');
+    return directory;
+  } catch {
+    return null;
+  }
 }
 
 export async function getUserInfo() {
   try {
-    const { stdout: user } = await $`blocklet config get user`;
+    const { stdout: name } = await $`blocklet config get name`;
     const { stdout: email } = await $`blocklet config get email`;
     return {
-      user: user?.trim(),
-      email: email?.trim(),
+      name: trimServerOutputVersion(name?.trim()),
+      email: trimServerOutputVersion(email?.trim()),
     };
   } catch {
     return {
-      user: '',
+      name: '',
       email: '',
     };
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-blocklet",
-  "version": "0.3.4",
+  "version": "0.3.7",
   "exports": "./index.js",
   "type": "module",
   "repository": "git@github.com:blocklet/create-blocklet.git",
@@ -13,9 +13,7 @@
     "index.js",
     "common",
     "lib",
-    "template-api",
-    "template-dapp",
-    "template-static"
+    "templates"
   ],
   "engines": {
     "node": ">=16.0.0"
@@ -31,9 +29,9 @@
     "test:run": "vitest run"
   },
   "dependencies": {
-    "@arcblock/did": "^1.14.25",
-    "@ocap/mcrypto": "^1.14.25",
-    "@ocap/util": "^1.14.25",
+    "@arcblock/did": "^1.16.0",
+    "@ocap/mcrypto": "^1.16.0",
+    "@ocap/util": "^1.16.0",
     "boxen": "^6.2.1",
     "ejs": "^3.1.6",
     "envfile": "^6.17.0",
@@ -42,9 +40,9 @@
     "jdenticon": "^3.1.1",
     "ora": "^6.1.0",
     "prompts": "^2.4.2",
-    "semver": "^7.3.5",
+    "semver": "^7.3.6",
     "terminal-link": "^3.0.0",
-    "zx": "^6.0.6"
+    "zx": "^6.0.7"
   },
   "devDependencies": {
     "@arcblock/eslint-config": "0.1.8",
@@ -59,6 +57,6 @@
     "eslint-plugin-react-hooks": "^4.2.0",
     "eslint-plugin-unicorn": "^34.0.1",
     "prettier": "^2.3.2",
-    "vitest": "^0.7.6"
+    "vitest": "^0.9.0"
   }
 }

package/{template-static/blocklet-page → templates/blocklet-page-static}/package.json

@@ -11,6 +11,6 @@
     "upload": "npm run bundle && blocklet upload .blocklet/release/blocklet.json"
   },
   "dependencies": {
-    "@xmark/cli": "^2.0.28"
+    "@xmark/cli": "^2.0.31"
   }
 }

package/{template-dapp/nextjs → templates/nextjs-dapp}/package.json

@@ -25,12 +25,12 @@
     ]
   },
   "dependencies": {
-    "@arcblock/did-auth": "^1.15.2",
+    "@arcblock/did-auth": "^1.16.0",
     "@arcblock/did-auth-storage-nedb": "^1.6.3",
-    "@blocklet/sdk": "^1.7.0",
-    "@ocap/client": "^1.15.2",
-    "@ocap/mcrypto": "^1.15.2",
-    "@ocap/wallet": "^1.15.2",
+    "@blocklet/sdk": "^1.7.6",
+    "@ocap/client": "^1.16.0",
+    "@ocap/mcrypto": "^1.16.0",
+    "@ocap/wallet": "^1.16.0",
     "dotenv-flow": "^3.2.0",
     "express": "^4.17.3",
     "next": "12.1.0",

package/templates/react-dapp/craco.config.js

@@ -0,0 +1,17 @@
+const port = process.env.BLOCKLET_PORT || process.env.PORT || 8080;
+const dappPort = process.env.APP_PORT || 3030;
+
+module.exports = {
+  devServer: {
+    port,
+    client: {
+      // If you want to development this blocklet without blocklet-server, you can delete next line, otherwise the hot reload will be failed.
+      webSocketURL: 'wss://0.0.0.0/ws',
+    },
+    proxy: {
+      '/api': {
+        target: `http://127.0.0.1:${dappPort}`,
+      },
+    },
+  },
+};

package/{template-dapp/react → templates/react-dapp}/package.json

@@ -2,8 +2,8 @@
   "name": "template-react",
   "version": "0.1.0",
   "scripts": {
-    "dev": "react-scripts start",
-    "build": "react-scripts build",
+    "dev": "craco start",
+    "build": "craco build",
     "eject": "react-scripts eject",
     "lint": "eslint src api --ext .mjs,.js,.jsx,.ts,.tsx",
     "start": "npm-run-all --parallel start:*",
@@ -39,12 +39,13 @@
     ]
   },
   "dependencies": {
-    "@arcblock/did-auth": "^1.15.2",
+    "@arcblock/did-auth": "^1.16.0",
     "@arcblock/did-auth-storage-nedb": "^1.6.3",
-    "@blocklet/sdk": "^1.7.0",
-    "@ocap/client": "^1.15.2",
-    "@ocap/mcrypto": "^1.15.2",
-    "@ocap/wallet": "^1.15.2",
+    "@blocklet/sdk": "^1.7.6",
+    "@craco/craco": "^6.4.3",
+    "@ocap/client": "^1.16.0",
+    "@ocap/mcrypto": "^1.16.0",
+    "@ocap/wallet": "^1.16.0",
     "axios": "^0.26.1",
     "compression": "^1.7.4",
     "cookie-parser": "^1.4.6",
@@ -70,7 +71,6 @@
     "eslint-plugin-react": "^7.24.0",
     "eslint-plugin-react-hooks": "^4.2.0",
     "eslint-plugin-unicorn": "^34.0.1",
-    "http-proxy-middleware": "^2.0.4",
     "husky": "^7.0.4",
     "lint-staged": "^12.3.7",
     "nodemon": "^2.0.15",

package/{template-static/react → templates/react-dapp}/src/app.css

@@ -8,19 +8,21 @@ body {
 }
 
 .app-logo {
-  height: 40vmin;
+  height: 10vmin;
   pointer-events: none;
 }
 
 .app-header {
-  background-color: #282c34;
   min-height: 100vh;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   font-size: calc(10px + 2vmin);
-  color: white;
+}
+
+pre {
+  font-size: 0.75em;
 }
 
 .app-link {

package/{template-dapp/react → templates/react-dapp}/src/pages/home.js

@@ -8,7 +8,7 @@ const Home = () => {
     <header className="app-header">
       <img src={logo} className="app-logo" alt="logo" />
       <pre style={{ textAlign: 'left' }}>
-        <code>{JSON.stringify(window.blocklet, null, 2)}</code>
+        <code>window.blocklet = {JSON.stringify(window.blocklet, null, 2)}</code>
       </pre>
       <Link className="app-link" to="/about">
         About

package/templates/react-gun-dapp/.env

@@ -0,0 +1,3 @@
+GENERATE_SOURCEMAP=false
+APP_PORT=3030
+REACT_APP_TITLE=''