Skip to main content

Folder Structure

After creation, your project should look like this:

javascript
my-blocklet/
  README.md
  blocklet.yml
  blocklet.md
  logo.png
  package.json

  .blocklet
  .eslintrc.js
  .prettierrc
  .npmrc
  .editorconfig
  .gitignore
  .env
  .github
  .husky
  .vscode

  src/
  dist/
  screenshots/

README.md

A description document of the project, briefly introducing some basic information about the project.

blocklet.yml

The configuration file for the Blocklet application, including the project name, version, author, description of the project, etc. It also contains configuration such as Auth Service and children components.

blocklet.md

A file dedicated to describing the Blocklet application that will be used as the description file for the Blocklet application after uploading the Blocklet to the Blocklet Store.

If this file does not exist, it will be downgraded to use the README.md file as the description file for the Blocklet application.

logo.png

The Blocklet icon file that will appear in the DID Wallet when the Blocklet application interacts with the DID Wallet.

package.json

Contains information such as the Blocklet application's dependencies.

.blocklet

The product folder of a packaged Blocklet application contains code packages that can be run directly in Blocklet Server.

This folder is automatically generated after the yarn bundle command is executed.

.eslintrc.js

A file for configuring ESLint rules.

Different templates come with different rules.

.prettierrc

The file used to configure Prettier rules.

.npmrc

The file used to configure npm.

.editorconfig

The file used to configure EditorConfig rules.

.gitignore

Used to configure the files that git ignores.

.env

The file containing the environment variables.

.github

The file used to configure GitHub.

.husky

The file used to configure Husky.

.vscode

The file used to configure the VSCode.

src/

The source file directory of the project, the structure in src is different in different templates, please refer to the README.md file in the production template for details

screenshots/

The image folder of the Blocklet application is used to display in the Blocklet Store details page after uploading to the Blocklet Store.

You also need to configure the screenshots field in blocklet.yml to specify the path to the blocklet application's image folder.