feat(create): add create dapp only (#232)

* feat(create): add create dapp only

* ask for inject config after create dapp only project

* fix: inject config with file path target

* chore: update readme for create dapp-only

* fix(readme): section link

Author: RetricSu

README.md

@@ -30,6 +30,7 @@ There are BREAKING CHANGES between v0.2.x and v0.3.x, make sure to read the [mig
   - [Tweak Devnet Config](#tweak-devnet-config)
   - [Create a full-stack Project](#create-a-full-stack-project)
   - [Create a script-only Project](#create-a-script-only-project)
+  - [Create a dApp-only Project](#create-a-dapp-only-project)
   - [Build and Deploy a script](#build-and-deploy-a-script)
   - [Start the frontend project](#start-the-frontend-project)
   - [Debug a transaction](#debug-a-transaction)
@@ -208,6 +209,14 @@ offckb create <your-project-name> --script
 
 Note: you need to have rust/cargo/cargo-generate/clang 16+ installed in your environment to use this command. offckb doesn't do anything really, it just call [ckb-script-template](https://github.com/cryptape/ckb-script-templates) to do all the magic.
 
+### Create a dApp-only Project
+
+You can create a new dApp project without the script(CKB Smart Contract). This is useful when you don't need to create your own on-chain script logic.
+
+```sh
+offckb create <your-project-name> --dapp # or -d
+```
+
 ### Build and Deploy a script
 
 The fullstack boilerplate project is a monorepo, which contains a script project and a frontend project.

src/cli.ts

@@ -11,7 +11,7 @@ import { DeployOptions, deploy } from './cmd/deploy';
 import { syncScripts } from './cmd/sync-scripts';
 import { TransferOptions, transfer } from './cmd/transfer';
 import { BalanceOption, balanceOf } from './cmd/balance';
-import { create, selectBareTemplate, CreateOption, createScriptProject } from './cmd/create';
+import { create, selectBareTemplate, CreateOption, createScriptProject, createDappProject } from './cmd/create';
 import { printMyScripts, DeployedScriptOption } from './cmd/my-scripts';
 import { Config, ConfigItem } from './cmd/config';
 import { debugSingleScript, debugTransaction, parseSingleScriptOption } from './cmd/debug';
@@ -35,12 +35,17 @@ program
   .command('create [your-project-name]')
   .description('Create a new dApp from bare templates')
   .option('-s, --script', 'Only create the script project')
+  .option('-d, --dapp', 'Only create the ccc dapp project')
   .action(async (projectName: string, option: CreateOption) => {
     const name = projectName ?? 'my-first-ckb-project';
     if (option.script) {
       return await createScriptProject(name);
     }
 
+    if (option.dapp) {
+      return await createDappProject(name);
+    }
+
     const template = await selectBareTemplate();
     return create(name, template);
   });

src/cmd/create.ts

@@ -1,17 +1,26 @@
 import path from 'path';
 import { findFileInFolder } from '../util/fs';
 import { gitCloneAndDownloadFolderSync } from '../util/git';
-import { select } from '@inquirer/prompts';
+import { injectConfig } from './inject-config';
+import { select, confirm } from '@inquirer/prompts';
 import { execSync } from 'child_process';
 import { genMyScriptsJsonFile, genSystemScriptsJsonFile } from '../scripts/gen';
 import { readSettings } from '../cfg/setting';
 import { BareTemplateOption, loadBareTemplateOpts } from '../template/option';
 import { OffCKBConfigFile } from '../template/offckb-config';
 const version = require('../../package.json').version;
 
-export interface CreateOption {
-  script: boolean;
-}
+export type ScriptOnly = {
+  script: true;
+  dapp?: false;
+};
+
+export type DappOnly = {
+  dapp: true;
+  script?: false;
+};
+
+export type CreateOption = ScriptOnly | DappOnly;
 
 export function createScriptProject(name: string) {
   const cmd = `cargo generate gh:cryptape/ckb-script-templates workspace --name ${name}`;
@@ -22,6 +31,17 @@ export function createScriptProject(name: string) {
   }
 }
 
+export async function createDappProject(name: string) {
+  const cmd = `npx create-ccc-app@latest ${name} --ts --}`;
+  try {
+    execSync(cmd, { encoding: 'utf-8', stdio: 'inherit' });
+    const dappFolderPath = path.resolve(process.cwd(), name);
+    await askForInjectOffckbConfig(dappFolderPath);
+  } catch (error: unknown) {
+    console.error('create ccc-appp project failed, ', (error as Error).message);
+  }
+}
+
 export async function create(name: string, template: BareTemplateOption) {
   const targetPath = path.resolve(process.cwd(), name);
   const settings = readSettings();
@@ -69,3 +89,13 @@ export async function selectBareTemplate() {
 
   return opts.find((opt) => opt.value === answer)!;
 }
+
+export async function askForInjectOffckbConfig(dappFolderPath: string) {
+  const answer = await confirm({
+    message: 'Do you want to inject offckb configs in your project  so that it can work with local blockchain info?',
+  });
+  if (answer) {
+    const target = path.resolve(dappFolderPath, 'offckb.config.ts');
+    injectConfig({ target });
+  }
+}

src/cmd/inject-config.ts

@@ -40,6 +40,7 @@ export function injectConfig({ target }: InjectConfigProp) {
   const myScriptCodeHash = offCKB.myScripts['script-name'].codeHash;
   const omnilockScriptCodeHash = offCKB.systemScripts['omnilock'].codeHash;
 
-Check example at https://github.com/nervosnetwork/docs.nervos.org/tree/develop/examples/simple-transfer
+Check more on how to integrate offckb config to develop your app at https://docs.nervos.org/docs/getting-started/quick-start#different-frontend-framework
+A Full example can also be found at https://github.com/nervosnetwork/docs.nervos.org/tree/develop/examples/simple-transfer
   `);
 }