create-blocklet 0.2.14 → 0.2.17

package/README.md

@@ -17,16 +17,16 @@ With NPM:
 npm init blocklet@latest [blocklet-name]
 ```
 
-With Yarn:
+With Yarn: (recommend)
 
 ```bash
 yarn create blocklet [blocklet-name]
 ```
 
-With PNPM:
+With PNPM: (recommend)
 
 ```bash
-pnpx create-blocklet [blocklet-name]
+pnpm create blocklet [blocklet-name]
 ```
 
 Currently supported template presets include:
@@ -34,10 +34,15 @@ Currently supported template presets include:
 **dapp**
 
 - `react`
+- `vue3 + vite`
+- `vue2 + @vue/cli`
 
 **static**
 
 - `react`
+- `vue3 + vite`
+- `vue2 + @vue/cli`
+- `blocklet page`
 
 ## Community Templates
 

package/common/_npmrc

@@ -0,0 +1,2 @@
+## force pnpm to hoist
+shamefully-hoist = true

package/index.js

@@ -7,7 +7,7 @@ import YAML from 'yaml';
 import { fileURLToPath } from 'url';
 import minimist from 'minimist';
 import prompts from 'prompts';
-import { yellow, red, green, cyan } from 'kolorist';
+import { yellow, red, green, cyan, blue, lightYellow } from 'kolorist';
 import * as envfile from 'envfile';
 
 import { echoBrand, echoDocument } from './lib/arcblock.js';
@@ -61,6 +61,11 @@ const TYPES = [
         display: 'vue2 + @vue/cli',
         color: green,
       },
+      {
+        name: 'blocklet-page',
+        display: 'blocklet page',
+        color: blue,
+      },
     ],
   },
 ];
@@ -76,6 +81,7 @@ const SERVICES = [
 const renameFiles = {
   _gitignore: '.gitignore',
   '_eslintrc.js': '.eslintrc.js',
+  _npmrc: '.npmrc',
 };
 
 async function init() {
@@ -364,9 +370,13 @@ async function init() {
     write('blocklet.md', modifyMd);
   }
   function modifyEnv(modifyFn = (...args) => ({ ...args })) {
-    const env = envfile.parse(read('.env'));
-    modifyFn(env);
-    write('.env', envfile.stringify(env));
+    try {
+      const env = envfile.parse(read('.env'));
+      modifyFn(env);
+      write('.env', envfile.stringify(env));
+    } catch {
+      console.warn(`\n${lightYellow('No .env file found, please add one.')}`);
+    }
   }
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-blocklet",
-  "version": "0.2.14",
+  "version": "0.2.17",
   "exports": "./index.js",
   "type": "module",
   "repository": "git@github.com:blocklet/create-blocklet.git",

package/template-static/blocklet-page/README.md

@@ -0,0 +1,143 @@
+# Getting Started with Create Blocklet
+
+This project was bootstrapped with [Create Blocklet](https://github.com/blocklet/create-blocklet).
+
+This blocklet is a static project, which means this is a frontend application. It's contained `client` code.
+
+## File Structure
+
+- public/ - static files
+  - favicon.ico - favicon
+  - favicon.svg - favicon
+- screenshots/ - Screenshots
+- site/ - Client side code (A standard Blocklet Page project)
+- .gitignore - Git ignore file
+- .prettierrc - Prettier configuration
+- blocklet.md - Blocklet README
+- blocklet.yml - Blocklet configuration
+- LICENSE - License file
+- logo.png - Blocklet logo file
+- Makefile - Makefile
+- 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` or `pnpm`
+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
+  make 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` from blocklet store.
+
+  > 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 blocklet store by Github CI.  
+  Bump version at first.
+
+  ```shell
+  make 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": "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/template-static/blocklet-page/blocklet.md

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

package/template-static/blocklet-page/blocklet.yml

@@ -0,0 +1,50 @@
+name: template-blocklet-page
+title: Blocklet Page Template
+description: A Blocklet Server blocklet
+keywords:
+  - blocklet
+  - blocklet-page
+  - xmark
+group: static
+did: ''
+main: dist
+author:
+  name: Arcblock
+  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:
+  - logo.png
+  - README.md
+  - blocklet.md
+  - screenshots
+interfaces:
+  - type: web
+    name: publicUrl
+    path: /
+    prefix: '*'
+    port: BLOCKLET_PORT
+    protocol: http
+community: ''
+documentation: ''
+homepage: ''
+license: ''
+payment:
+  tokens: []
+  shares: []
+timeout:
+  start: 60
+requirements:
+  abtnode: '>=1.6.22'
+  os: '*'
+  cpu: '*'
+scripts:
+  dev: npm run start
+environments: []
+capabilities: {}
+screenshots: []
+children: []

package/template-static/blocklet-page/package.json

@@ -0,0 +1,16 @@
+{
+  "private": true,
+  "scripts": {
+    "start": "xmark start",
+    "dev": "xmark start --open",
+    "build": "xmark build",
+    "clean": "rm -rf .blocklet",
+    "bundle": "npm run clean && npm run build && blocklet bundle --create-release",
+    "deploy": "npm run bundle && blocklet deploy .blocklet/bundle",
+    "upload": "npm run bundle && blocklet upload .blocklet/release/blocklet.json"
+  },
+  "dependencies": {
+    "@xmark/cli": "^2.0.11"
+  },
+  "name": "blocklet-page"
+}

package/template-static/blocklet-page/site/blocks/CustomBlock.mdx

@@ -0,0 +1,3 @@
+I'm a custom component
+
+I can write anything in here

package/template-static/blocklet-page/site/composes/MyLayout.mdx

@@ -0,0 +1,5 @@
+---
+name: Page
+header: This is header
+footer: This is footer
+---

package/template-static/blocklet-page/site/pages/index.mdx

@@ -0,0 +1,5 @@
+---
+layout: 'my-layout'
+blocks:
+  - name: CustomBlock
+---

package/template-static/blocklet-page/xmark.yml

@@ -0,0 +1,4 @@
+name: Blocklet Page Demo
+title: Blocklet Page Demo
+description: This is Blocklet Page Demo, powered by Blocklet Page
+siteRoot: site