Updated example code

example/typescript_react/.eslintrc.cjs

@@ -257,6 +257,9 @@ module.exports = {
       'typescript': {
         'alwaysTryTypes': true, // always try to resolve types under `<root>@types` directory even it doesn't contain any source code, like `@types/unist`
       }
+    },
+    react: {
+      version: 'detect',
     }
   }
 }

example/typescript_react/README.md

@@ -1,50 +1,23 @@
-# Typescript + React
+# Summary
+This is an example code to use `clvm-js` with typescript and react with vite.
 
-## Setup
-```shell
-yarn
-yarn build
-# or
-npm install
-npm run build
-```
+# Setup
 
-## Start web page
 ```shell
-yarn start
-# or
-npm run start
-```
+# 0. Install pnpm (yarn is also OK)
+# 1. Clone this repository
+git clone https://github.com/Chia-Mine/clvm-js
+cd clvm-js
 
-## Memo - How to set up react+typescript project from scratch
-```shell
-npx create-react-app some-project --template typescript
-cd some-project
-yarn add clvm_tools
-```
-Then copy wasm files from npm package.
-```shell
-mkdir -p ./public/static/js
-cp ./node_modules/clvm_tools/browser/*.wasm ./public/static/js/
-```
-**Note**: Redistributing your project with bundled `blsjs.wasm` and/or `clvm_rs_bg.wasm` must be compliant with Apache2.0 License provided by [Chia-Network](https://github.com/Chia-Network/)
+# 2. Build clvm-js
+pnpm i # or `yarn`, `npm i`
+pnpm build # or `yarn build`, `npm run build`
+
+# 3. Build example code for web browsers
+cd example/typescript_react
+pnpm i # or `yarn`, `npm i`
+pnpm build # or `yarn build`, `npm run build`
 
-Additionally, copy and paste below to package.json.  
-This prevents `babel` in `react-scripts` from applying [the problematic transform](https://github.com/facebook/create-react-app/issues/10785).
+# 4. Run demo server
+pnpm start # or `yarn start`, `npm start`
 ```
-  "browserslist": [
-    "edge >= 79",
-    "firefox >= 68",
-    "chrome >= 67",
-    "safari > 14",
-    "opera >= 54",
-    "ios_saf >= 14.4",
-    "android >= 67",
-    "op_mob >= 48",
-    "and_chr >= 67",
-    "and_ff >= 68",
-    "samsung >= 9.2",
-    "node >= 10.4.0",
-    "electron >= 4.0.0"
-  ]
-```

example/typescript_react/package.json

@@ -24,9 +24,8 @@
     "vite": "^5.2.11"
   },
   "scripts": {
-    "dev": "vite",
+    "start": "vite",
     "build": "tsc && vite build",
-    "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
-    "preview": "vite preview --port 4200"
+    "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0"
   }
 }

example/typescript_webpack/README.md

@@ -1,5 +1,5 @@
 # Summary
-This is just an example code to use `clvm-js` with typescript and webpack.
+This is an example code to use `clvm-js` with typescript and webpack.
 
 # Setup
 ```shell
@@ -9,14 +9,14 @@ git clone https://github.com/Chia-Mine/clvm-js
 cd clvm-js
 
 # 2. Build clvm-js
-pnpm i
-pnpm build
+pnpm i # or `yarn`, `npm i`
+pnpm build # or `yarn build`, `npm run build`
 
 # 3. Build example code for web browsers
 cd example/typescript_webpack
-pnpm i
-pnpm build
+pnpm i # or `yarn`, `npm i`
+pnpm build # or `yarn build`, `npm run build`
 
 # 4. Run demo server
-pnpm start
+pnpm start # or `yarn start`, `npm start`
 ```