create-blocklet 0.5.11 → 0.5.13

package/index.js

@@ -37,6 +37,11 @@ const templates = [
     display: '[dapp] react + express.js',
     color: yellow,
   },
+  {
+    name: 'react-dapp-ts',
+    display: '[dapp] react + express + typescript',
+    color: yellow,
+  },
   {
     name: 'solidjs-dapp',
     display: '[dapp] solid + express.js',

package/lib/server.js

@@ -3,8 +3,14 @@ import semver from 'semver';
 
 $.verbose = false;
 
-function trimServerOutputVersion(output = '') {
-  return output?.replace(/blocklet \S+ v\d+\.\d+\.\d+\n+/g, '');
+async function trimServerOutputVersion(output = '', command) {
+  // 调用 blocklet 命令时，都会在第一行先打印一个 blocklet [command] [version] 的信息，需要把这个信息 trim 掉
+  const version = await getServerVersion();
+  if (command) {
+    return output?.replace(`blocklet ${command} v${version}\n`, '');
+  }
+  const reg = new RegExp(`blocklet \\S+ v${version}\\n+`, 'g');
+  return output?.replace(reg, '');
 }
 
 export async function checkServerInstalled() {
@@ -42,7 +48,8 @@ export async function checkServerRunning() {
 
 export async function checkSatisfiedVersion() {
   const version = await getServerVersion();
-  return semver.satisfies(version, '>= 1.7.0');
+  const cleanVersion = semver.valid(semver.coerce(version));
+  return semver.satisfies(cleanVersion, '>= 1.7.0');
 }
 
 export async function getServerDirectory() {
@@ -63,8 +70,8 @@ export async function getUserInfo() {
     const { stdout: name } = await $`blocklet config get name`;
     const { stdout: email } = await $`blocklet config get email`;
     return {
-      name: trimServerOutputVersion(name?.trim()),
-      email: trimServerOutputVersion(email?.trim()),
+      name: await trimServerOutputVersion(name?.trim()),
+      email: await trimServerOutputVersion(email?.trim()),
     };
   } catch {
     return {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-blocklet",
-  "version": "0.5.11",
+  "version": "0.5.13",
   "exports": "./index.js",
   "type": "module",
   "repository": "git@github.com:blocklet/create-blocklet.git",
@@ -29,9 +29,9 @@
     "test:run": "vitest run"
   },
   "dependencies": {
-    "@arcblock/did": "^1.18.31",
-    "@ocap/mcrypto": "^1.18.31",
-    "@ocap/util": "^1.18.31",
+    "@arcblock/did": "^1.18.36",
+    "@ocap/mcrypto": "^1.18.36",
+    "@ocap/util": "^1.18.36",
     "boxen": "^6.2.1",
     "ejs": "^3.1.8",
     "envfile": "^6.18.0",
@@ -46,8 +46,8 @@
   },
   "devDependencies": {
     "@arcblock/eslint-config-base": "0.2.2",
-    "eslint": "^8.29.0",
-    "prettier": "^2.8.1",
+    "eslint": "^8.33.0",
+    "prettier": "^2.8.3",
     "vitest": "^0.19.1"
   }
 }

package/templates/docsite/package.json

@@ -15,8 +15,8 @@
     "bump-version": "zx scripts/bump-version.mjs"
   },
   "dependencies": {
-    "@xmark/cli": "^2.4.87",
-    "@xmark/theme-docs": "^2.4.87",
+    "@xmark/cli": "^2.4.90",
+    "@xmark/theme-docs": "^2.4.90",
     "bumpp": "^8.2.1",
     "rimraf": "^3.0.2",
     "zx": "^7.1.1"

package/templates/express-api/package.json

@@ -31,19 +31,19 @@
   "license": "ISC",
   "dependencies": {
     "@arcblock/did-auth-storage-nedb": "^1.7.1",
-    "@blocklet/sdk": "^1.8.45",
-    "@ocap/client": "^1.18.31",
+    "@blocklet/sdk": "^1.8.62",
+    "@ocap/client": "^1.18.36",
     "dotenv-flow": "^3.2.0",
     "express": "^4.18.2"
   },
   "devDependencies": {
     "@arcblock/eslint-config-base": "^0.2.3",
     "bumpp": "^8.2.1",
-    "eslint": "^8.29.0",
-    "husky": "^8.0.2",
+    "eslint": "^8.33.0",
+    "husky": "^8.0.3",
     "lint-staged": "^12.5.0",
     "nodemon": "^2.0.20",
-    "prettier": "^2.8.1",
+    "prettier": "^2.8.3",
     "rimraf": "^3.0.2",
     "zx": "^7.1.1"
   }

package/templates/monorepo/package.json

@@ -25,9 +25,9 @@
   "devDependencies": {
     "@arcblock/eslint-config": "0.2.2",
     "bumpp": "^7.2.0",
-    "eslint": "^8.29.0",
+    "eslint": "^8.33.0",
     "husky": "^4.3.8",
-    "prettier": "^2.8.1",
+    "prettier": "^2.8.3",
     "zx": "^7.1.1"
   }
 }

package/templates/nextjs-dapp/package.json

@@ -28,12 +28,12 @@
     ]
   },
   "dependencies": {
-    "@arcblock/did-auth": "^1.18.31",
+    "@arcblock/did-auth": "^1.18.36",
     "@arcblock/did-auth-storage-nedb": "^1.7.1",
-    "@blocklet/sdk": "^1.8.45",
-    "@ocap/client": "^1.18.31",
-    "@ocap/mcrypto": "^1.18.31",
-    "@ocap/wallet": "^1.18.31",
+    "@blocklet/sdk": "^1.8.62",
+    "@ocap/client": "^1.18.36",
+    "@ocap/mcrypto": "^1.18.36",
+    "@ocap/wallet": "^1.18.36",
     "dotenv-flow": "^3.2.0",
     "express": "^4.18.2",
     "next": "12.2.3",
@@ -44,7 +44,7 @@
     "bumpp": "^8.2.1",
     "eslint": "8.20.0",
     "eslint-config-next": "12.2.3",
-    "husky": "^8.0.2",
+    "husky": "^8.0.3",
     "lint-staged": "^12.5.0",
     "nodemon": "^2.0.20",
     "npm-run-all": "^4.1.5",

package/templates/react-dapp/package.json

@@ -40,12 +40,12 @@
     ]
   },
   "dependencies": {
-    "@arcblock/did-auth": "^1.18.31",
+    "@arcblock/did-auth": "^1.18.36",
     "@arcblock/did-auth-storage-nedb": "^1.7.1",
-    "@blocklet/sdk": "^1.8.45",
-    "@ocap/client": "^1.18.31",
-    "@ocap/mcrypto": "^1.18.31",
-    "@ocap/wallet": "^1.18.31",
+    "@blocklet/sdk": "^1.8.62",
+    "@ocap/client": "^1.18.36",
+    "@ocap/mcrypto": "^1.18.36",
+    "@ocap/wallet": "^1.18.36",
     "axios": "^0.27.2",
     "compression": "^1.7.4",
     "cookie-parser": "^1.4.6",
@@ -56,7 +56,7 @@
     "express-history-api-fallback": "^2.2.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-router-dom": "^6.4.5",
+    "react-router-dom": "^6.8.0",
     "rimraf": "^3.0.2"
   },
   "devDependencies": {
@@ -64,14 +64,14 @@
     "@vitejs/plugin-react": "^2.2.0",
     "bumpp": "^8.2.1",
     "cross-env": "^7.0.3",
-    "eslint": "^8.29.0",
-    "husky": "^8.0.2",
+    "eslint": "^8.33.0",
+    "husky": "^8.0.3",
     "lint-staged": "^12.5.0",
     "nodemon": "^2.0.20",
     "npm-run-all": "^4.1.5",
-    "prettier": "^2.8.1",
+    "prettier": "^2.8.3",
     "vite": "^3.2.5",
-    "vite-plugin-blocklet": "^0.5.11",
+    "vite-plugin-blocklet": "^0.5.13",
     "vite-plugin-svgr": "^2.4.0",
     "zx": "^7.1.1"
   }

package/templates/react-dapp-ts/.eslintrc.js

@@ -0,0 +1,7 @@
+module.exports = {
+  root: true,
+  extends: '@arcblock/eslint-config-ts',
+  parserOptions: {
+    project: 'tsconfig.json',
+  },
+};

package/templates/react-dapp-ts/README.md

@@ -0,0 +1,157 @@
+# Getting Started with Create Blocklet
+
+This project was bootstrapped with [Create Blocklet](https://github.com/blocklet/create-blocklet).
+
+This blocklet is a dapp project, which means this is a full-stack application. It's contained both `server` and `client` code.
+
+## Launch on Blocklet Server
+
+[![Launch on Blocklet Server](https://assets.arcblock.io/icons/launch_on_blocklet_server.svg)](https://install.arcblock.io/launch?action=blocklet-install&meta_url=https%3A%2F%2Fgithub.com%2Fblocklet%2Fpages-kit%2Freleases%2Fdownload%2Fv0.1.33%2Fblocklet.json)
+
+## File Structure
+
+- public/ - static files
+  - favicon.ico - favicon
+  - favicon.svg - favicon
+  - index.html - main html file, template for react
+- screenshots/ - Screenshots
+- api/
+  - src/ - Api side code
+    - hooks/ - blocklet lifecycle hooks
+    - libs/ - Api side libraries
+    - middlewares/ - Api side middlewares
+    - routes/ - Api side routes
+    - index.ts - Api side entry point
+- src/ - Client side code (A standard react app structure)
+- .env - Environment variables
+- .env.local - Local environment variables
+- .eslintrc.js - ESLint configuration
+- .gitignore - Git ignore file
+- .prettierrc - Prettier configuration
+- blocklet.md - Blocklet README
+- blocklet.yml - Blocklet configuration
+- LICENSE - License file
+- logo.png - Blocklet logo file
+- package.json - Npm package file
+- README.md - A guide for this blocklet
+- version - Version file
+
+## Development
+
+1. Make sure you have [@blocklet/cli](https://www.npmjs.com/package/@blocklet/cli) installed
+
+   Blocklet needs blocklet server as a dependency. So you need to install it first.
+   `npm install -g @blocklet/cli`
+   See details in [https://docs.arcblock.io/abtnode/en/introduction/abtnode-setup#use-the-binary-distribution](https://docs.arcblock.io/abtnode/en/introduction/abtnode-setup#use-the-binary-distribution)
+
+2. Init blocklet server & start blocklet server
+
+   Before starting an blocklet server, you need to init blocklet server.
+   `blocklet server init --mode=debug`
+   `blocklet server start`
+   See details in [https://docs.arcblock.io/abtnode/en/introduction/abtnode-setup#configure-abt-node](https://docs.arcblock.io/abtnode/en/introduction/abtnode-setup#configure-abt-node)
+
+3. Go to the project directory `cd [name]`
+4. Install dependencies: `npm install` or `yarn`
+5. Start development server: `blocklet dev`
+
+## Bundle
+
+After developing a blocklet, you may need to bundle it. Use `npm run bundle` command.
+
+## Deploy
+
+- If you want to deploy this blocklet to local blocklet server, you can use `blocklet deploy .blocklet/bundle` command(Make sure the blocklet is bundled before deployment).
+  > Or you can simply use `npm run deploy` command.
+- If you want to deploy this blocklet to remote blocklet server, you can use the command below.
+
+  ```shell
+  blocklet deploy .blocklet/bundle --endpoint {your blocklet server url} --access-key {blocklet server access key} --access-secret {blocklet server access secret}
+  ```
+
+  > Make sure the blocklet is bundled before deployment.
+
+## Upload to blocklet store
+
+- If you want to upload the blocklet to any store for other users to download and use, you can following the following instructions.
+
+  Bump version at first.
+
+  ```shell
+  npm run bump-version
+  ```
+
+  Then config blocklet store url.
+  You can use those store url in below.
+
+  1. [https://store.blocklet.dev/](https://store.blocklet.dev/)
+  2. [https://dev.store.blocklet.dev/](https://dev.store.blocklet.dev/)
+  3. A blocklet store started by yourself.
+     > Make sure you have installed a `blocklet store` on your own blocklet server. Check it on here: [https://store.blocklet.dev/blocklet/z8ia29UsENBg6tLZUKi2HABj38Cw1LmHZocbQ](https://store.blocklet.dev/blocklet/z8ia29UsENBg6tLZUKi2HABj38Cw1LmHZocbQ)
+
+  ```shell
+  blocklet config set store {store url}
+  ```
+
+  Get a `accessToken` by using this command.
+
+  > Why we need a `accessToken`?
+  > A `accessToken` is genrate by blocklet store, which help us upload our blocklet to any store.
+
+  Set `accessToken` to blocklet config
+
+  ```shell
+  blocklet config set accessToken {accessToken}
+  ```
+
+  Upload a new version to a store.
+
+  > Make sure the blocklet is bundled before upload.
+
+  ```shell
+  blocklet upload
+  ```
+
+  Or you can simply use `npm run upload` command.
+
+- You also can upload a new version to a store by Github CI.
+  Bump version at first.
+
+  ```shell
+  npm run bump-version
+  ```
+
+  Push your code to Github main/master branch, or make a pull request to the main/master branch.
+  The CI workflow will automatically upload a new version to a store.
+
+## Q & A
+
+1. Q: How to change a blocklet's name?
+
+   A: Change the `name` field in the `package.json` file, change the `name` field in the `blocklet.yml` file.
+
+   You can also change the `title` field and `description` field in the `blocklet.yml` file.
+
+   Run `blocklet meta` command, you will get a `did` config, copy the `did` value.
+
+   Replace this command `"bundle:client": "PUBLIC_URL='/.blocklet/proxy/{did}' npm run build",` in `package.json`
+
+   Replace `did` field in the `blocklet.yml`
+
+2. Q: How to change a blocklet's logo?
+
+   Change the `logo.png` file root folder.
+
+   Or you can change the `logo` field in the `blocklet.yml` file.
+
+   > Make sure you have added the logo path to the `blocklet.yml` file `files` field.
+
+## Learn More
+
+- Full specification of `blocklet.yml`: [https://github.com/blocklet/blocklet-specification/blob/main/docs/meta.md](https://github.com/blocklet/blocklet-specification/blob/main/docs/meta.md)
+- Full document of Blocklet Server & blocklet development: [https://docs.arcblock.io/abtnode/en/introduction](https://docs.arcblock.io/abtnode/en/introduction)
+
+## License
+
+The code is licensed under the Apache 2.0 license found in the
+[LICENSE](LICENSE) file.

package/templates/react-dapp-ts/api/dev.ts

@@ -0,0 +1,6 @@
+// eslint-disable-next-line import/no-extraneous-dependencies
+import { setupClient } from 'vite-plugin-blocklet';
+
+import { app } from './src';
+
+setupClient(app);

package/templates/react-dapp-ts/api/hooks/pre-start.js

@@ -0,0 +1,12 @@
+/* eslint-disable global-require */
+
+const isDevelopment = process.env.BLOCKLET_MODE === 'development';
+
+if (isDevelopment) {
+  // rename `require` to skip deps resolve when bundling
+  const r = require;
+  r('ts-node').register();
+  r('../src/hooks/pre-start');
+} else {
+  require('../dist/hooks/pre-start');
+}

package/templates/react-dapp-ts/api/src/hooks/pre-start.ts

@@ -0,0 +1,37 @@
+import '@blocklet/sdk/lib/error-handler';
+
+import Client from '@ocap/client';
+import dotenv from 'dotenv-flow';
+
+import { wallet } from '../libs/auth';
+import env from '../libs/env';
+import logger from '../libs/logger';
+
+dotenv.config();
+
+const { name } = require('../../../package.json');
+
+const ensureAccountDeclared = async () => {
+  if (env.isComponent) return;
+  if (!env.chainHost) return;
+
+  const client = new Client(env.chainHost);
+  // @ts-ignore
+  const { state } = await client.getAccountState({ address: wallet.toAddress() }, { ignoreFields: ['context'] });
+  if (!state) {
+    const hash = await client.declare({ moniker: name, wallet });
+    logger.log(`app account declared on chain ${env.chainHost}`, hash);
+  } else {
+    logger.log(`app account already declared on chain ${env.chainHost}`);
+  }
+};
+
+(async () => {
+  try {
+    await ensureAccountDeclared();
+    process.exit(0);
+  } catch (err) {
+    logger.error(`${name} pre-start error`, err.message);
+    process.exit(1);
+  }
+})();

package/templates/react-dapp-ts/api/src/index.ts

@@ -0,0 +1,50 @@
+import 'express-async-errors';
+
+import path from 'path';
+
+import compression from 'compression';
+import cookieParser from 'cookie-parser';
+import cors from 'cors';
+import dotenv from 'dotenv-flow';
+import express, { ErrorRequestHandler } from 'express';
+import fallback from 'express-history-api-fallback';
+
+import logger from './libs/logger';
+import routes from './routes';
+
+dotenv.config();
+
+const { name, version } = require('../../package.json');
+
+export const app = express();
+
+app.set('trust proxy', true);
+app.use(cookieParser());
+app.use(express.json({ limit: '1 mb' }));
+app.use(express.urlencoded({ extended: true, limit: '1 mb' }));
+app.use(cors());
+
+const router = express.Router();
+router.use('/api', routes);
+app.use(router);
+
+const isProduction = process.env.NODE_ENV === 'production' || process.env.ABT_NODE_SERVICE_ENV === 'production';
+
+if (isProduction) {
+  const staticDir = path.resolve(process.env.BLOCKLET_APP_DIR!, 'dist');
+  app.use(compression());
+  app.use(express.static(staticDir, { maxAge: '30d', index: false }));
+  app.use(fallback('index.html', { root: staticDir }));
+
+  app.use(<ErrorRequestHandler>((err, _, res) => {
+    logger.error(err.stack);
+    res.status(500).send('Something broke!');
+  }));
+}
+
+const port = parseInt(process.env.BLOCKLET_PORT!, 10);
+
+export const server = app.listen(port, (err?: any) => {
+  if (err) throw err;
+  logger.info(`> ${name} v${version} ready on ${port}`);
+});

package/templates/react-dapp-ts/api/src/libs/auth.ts

@@ -0,0 +1,17 @@
+import path from 'path';
+
+import AuthStorage from '@arcblock/did-auth-storage-nedb';
+import getWallet from '@blocklet/sdk/lib/wallet';
+import WalletAuthenticator from '@blocklet/sdk/lib/wallet-authenticator';
+import WalletHandler from '@blocklet/sdk/lib/wallet-handler';
+
+import env from './env';
+
+export const wallet = getWallet();
+export const authenticator = new WalletAuthenticator();
+export const handlers = new WalletHandler({
+  authenticator,
+  tokenStorage: new AuthStorage({
+    dbPath: path.join(env.dataDir, 'auth.db'),
+  }),
+});

package/templates/react-dapp-ts/api/src/libs/env.ts

@@ -0,0 +1,6 @@
+import env from '@blocklet/sdk/lib/env';
+
+export default {
+  ...env,
+  chainHost: process.env.CHAIN_HOST || '',
+};

package/templates/react-dapp-ts/api/src/libs/logger.ts

@@ -0,0 +1,3 @@
+const logger = console;
+
+export default logger;

package/templates/react-dapp-ts/api/src/routes/index.ts

@@ -0,0 +1,8 @@
+import middleware from '@blocklet/sdk/lib/middlewares';
+import { Router } from 'express';
+
+const router = Router();
+
+router.use('/user', middleware.user(), (req, res) => res.json(req.user || {}));
+
+export default router;

package/templates/react-dapp-ts/api/third.d.ts

@@ -0,0 +1,15 @@
+declare module 'vite-plugin-blocklet';
+
+declare module 'express-history-api-fallback';
+
+declare module 'express-async-errors';
+
+namespace Express {
+  interface Request {
+    user?: {
+      did: string;
+      role: string;
+      fullName: string;
+    };
+  }
+}

package/templates/react-dapp-ts/blocklet.md

@@ -0,0 +1,3 @@
+# template-react
+
+A react template for creating a new blocklet project.

package/templates/react-dapp-ts/blocklet.yml

@@ -0,0 +1,50 @@
+name: template-react-dapp-ts
+title: Blocklet Template React
+description: A Blocklet DAPP blocklet
+keywords:
+  - blocklet
+  - react
+group: dapp
+did: ''
+main: api/dist/index.js
+author:
+  name: Blocklet
+  email: blocklet@arcblock.io
+repository:
+  type: git
+  url: 'git+https://github.com/blocklet/create-blocklet.git'
+specVersion: 1.1.1
+version: 0.1.0
+logo: logo.png
+files:
+  - dist
+  - logo.png
+  - screenshots
+  - api/hooks/pre-start.js
+interfaces:
+  - type: web
+    name: publicUrl
+    path: /
+    prefix: '*'
+    port: BLOCKLET_PORT
+    protocol: http
+community: ''
+documentation: ''
+homepage: ''
+license: ''
+payment:
+  price: []
+  share: []
+timeout:
+  start: 60
+requirements:
+  server: '>=1.6.29'
+  os: '*'
+  cpu: '*'
+scripts:
+  preStart: node api/hooks/pre-start.js
+  dev: npm run start
+environments: []
+capabilities: {}
+screenshots: []
+components: []

package/templates/react-dapp-ts/index.html

@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
+    <meta name="theme-color" content="#4F6AF5" />
+    <meta name="description" content="Web site created using create-blocklet" />
+  </head>
+  <body>
+    <noscript> You need to enable JavaScript to run this app. </noscript>
+    <div id="app"></div>
+    <script type="module" src="/src/index.tsx"></script>
+  </body>
+</html>