create-blocklet 0.3.3 → 0.3.6

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/index.js

@@ -5,7 +5,7 @@ import boxen from 'boxen';
 import { fileURLToPath } from 'url';
 import { execSync } from 'child_process';
 import { cd, argv, fs, YAML, chalk, path } from 'zx';
-import { startSpinner } from 'zx/experimental';
+import ora from 'ora';
 import prompts from 'prompts';
 import * as envfile from 'envfile';
 
@@ -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,
+      },
     ],
   },
   {
@@ -206,7 +211,7 @@ async function init() {
   // user choice associated with prompts
   const { type, framework, overwrite, packageName, authorName, authorEmail } = result;
 
-  const stopSpinner = startSpinner();
+  await echoDocument();
 
   const root = path.join(cwd, targetDir);
 
@@ -216,25 +221,29 @@ async function init() {
     fs.mkdirSync(root);
   }
 
-  await echoDocument();
-
-  console.log('Checking blocklet server runtime environment...', '\n');
+  const checkSpinner = ora({
+    text: 'Checking blocklet server runtime environment\n',
+  }).start();
 
   const isServerInstalled = await checkServerInstalled();
   const isSatisfiedVersion = await checkSatisfiedVersion();
   const isServerRunning = await checkServerRunning();
+  checkSpinner.succeed('Done');
+
+  console.log(`\nScaffolding project in ${cyan(root)}`);
 
-  console.log(`\n\nScaffolding project in ${root}...`);
+  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;
       }
@@ -307,9 +316,9 @@ async function init() {
     // fs.writeFileSync(path.join(root, 'logo.png'), pngIcon);
   })();
 
+  scaffoldSpinner.succeed('✨  Done. Now run:\n');
+
   const related = path.relative(cwd, root);
-  console.log('\n\n✨  Done. Now run:\n');
-  stopSpinner();
 
   // const pkgManager =
   //   // eslint-disable-next-line no-nested-ternary
@@ -319,19 +328,20 @@ async function init() {
   //     ? 'yarn'
   //     : 'npm';
   try {
-    const { yes } = await prompts(
-      {
-        type: 'confirm',
-        name: 'yes',
-        initial: 'Y',
-        message: 'Install and start it now?',
-      },
-      {
-        onCancel: () => {
-          throw new Error(`${red('✖')} Operation cancelled`);
-        },
-      }
-    );
+    // const { yes } = await prompts(
+    //   {
+    //     type: 'confirm',
+    //     name: 'yes',
+    //     initial: 'Y',
+    //     message: 'Install and start it now?',
+    //   },
+    //   {
+    //     onCancel: () => {
+    //       throw new Error(`${red('✖')} Operation cancelled`);
+    //     },
+    //   }
+    // );
+    const yes = false;
     let hasStart = false;
 
     await initGitRepo(root);
@@ -413,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');
     }
@@ -465,9 +474,10 @@ async function init() {
       const env = envfile.parse(envContent);
       modifyFn(env);
       write('.env', envfile.stringify(env));
-    } else {
-      console.warn(`\n${yellow('No .env file found, please add one.')}`);
     }
+    // else {
+    //   console.warn(`\n${yellow('No .env file found, please add one.')}`);
+    // }
   }
 }
 

package/lib/did.js

@@ -7,7 +7,7 @@ import { fromPublicKey } from '@arcblock/did';
 const { types } = Mcrypto;
 
 export function toBlockletDid(name) {
-  const pk = toHex(name);
+  const pk = toHex(Buffer.from(typeof name === 'string' ? name.trim() : name));
   return fromPublicKey(pk, { role: types.RoleType.ROLE_ANY });
 }
 

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.3",
+  "version": "0.3.6",
   "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,19 +29,20 @@
     "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",
     "figlet": "^1.5.2",
     "gradient-string": "^2.0.0",
     "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",
@@ -58,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-api/express → templates/express-api}/blocklet.yml

@@ -33,10 +33,9 @@ community: ''
 documentation: ''
 homepage: ''
 license: ''
-charging:
-  price: 0
-  tokens: []
-  shares: []
+payment:
+  price: []
+  share: []
 timeout:
   start: 60
 requirements:

package/{template-dapp/nextjs → templates/nextjs-dapp}/blocklet.yml

@@ -34,10 +34,9 @@ community: ''
 documentation: ''
 homepage: ''
 license: ''
-charging:
-  price: 0
-  tokens: []
-  shares: []
+payment:
+  price: []
+  share: []
 timeout:
   start: 60
 requirements:

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/{template-dapp/react → templates/react-dapp}/blocklet.yml

@@ -34,10 +34,9 @@ community: ''
 documentation: ''
 homepage: ''
 license: ''
-charging:
-  price: 0
-  tokens: []
-  shares: []
+payment:
+  price: []
+  share: []
 timeout:
   start: 60
 requirements:

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 {