|
| 1 | +# Build Instructions |
| 2 | + |
| 3 | +## Table of Contents |
| 4 | + |
| 5 | +- [Prerequisites](#prerequisites) |
| 6 | +- [Package Versions](#package-versions) |
| 7 | +- [Installation](#installation) |
| 8 | +- [Running the Project](#running-the-project) |
| 9 | +- [Testing](#testing) |
| 10 | +- [TypeScript Configuration](#typescript-configuration) |
| 11 | +- [Platform-Specific Notes](#platform-specific-notes) |
| 12 | +- [Deployment](#deployment) |
| 13 | +- [Troubleshooting](#troubleshooting) |
| 14 | +## Prerequisites |
| 15 | + |
| 16 | +Before building and running the project, ensure you have the following installed: |
| 17 | + |
| 18 | +### Required Software |
| 19 | + |
| 20 | +- **Node.js**: ≥22.12.0 (required for Hardhat 3 and Vite 7) [Installation instructions](https://github.com/nvm-sh/nvm) |
| 21 | +- **npm**: ≥10.0.0 (usually comes with Node.js) |
| 22 | +- **Docker** (Optional): For containerized deployment. [Download](https://www.docker.com/get-started) |
| 23 | +- **MetaMask**: Browser extension for Ethereum wallet management. [Download](https://metamask.io/) |
| 24 | + |
| 25 | +**Verify your installation:** |
| 26 | +```bash |
| 27 | +node --version # Should output v22.12.0 or higher |
| 28 | +npm --version # Should output 10.0.0 or higher |
| 29 | +``` |
| 30 | + |
| 31 | +**Why Node.js 22.12.0+?** |
| 32 | +- `trust-anchor-did-ethr` uses Hardhat 3, which requires Node.js ≥22.10.0 |
| 33 | +- Vite 7 supports Node.js 20.19+ or 22.12+, but we standardize on 22.12+ for consistency |
| 34 | +- Using Node.js 20.x will cause Hardhat runtime errors like `flatMap is not a function` |
| 35 | + |
| 36 | +## Package Versions |
| 37 | + |
| 38 | +This project uses the following key dependencies: |
| 39 | + |
| 40 | +### Smart Contracts (trust-anchor-did-ethr) |
| 41 | + |
| 42 | +```json |
| 43 | +{ |
| 44 | + "hardhat": "^3.1.0", |
| 45 | + "typescript": "~5.8.0", |
| 46 | + "@nomicfoundation/hardhat-ignition": "^3.0.6", |
| 47 | + "@nomicfoundation/hardhat-toolbox-viem": "^5.0.1", |
| 48 | + "viem": "^2.43.2" |
| 49 | +} |
| 50 | +``` |
| 51 | + |
| 52 | +### Frontend (demo-app-frontend) |
| 53 | + |
| 54 | +```json |
| 55 | +{ |
| 56 | + "react": "^19.2.0", |
| 57 | + "react-dom": "^19.2.0", |
| 58 | + "typescript": "~5.9.3", |
| 59 | + "vite": "^7.2.4", |
| 60 | + "wagmi": "^3.1.0", |
| 61 | + "viem": "^2.43.3" |
| 62 | +} |
| 63 | +``` |
| 64 | + |
| 65 | +**Note**: The project uses TypeScript 5.8.x for smart contracts and 5.9.x for frontend. This is intentional and should not cause conflicts as packages are isolated. |
| 66 | + |
| 67 | +## Installation |
| 68 | + |
| 69 | +### Install Dependencies for Each Package |
| 70 | + |
| 71 | +#### 1. Smart Contracts (trust-anchor-did-ethr) |
| 72 | + |
| 73 | +```bash |
| 74 | +cd packages/trust-anchor-did-ethr |
| 75 | +npm install |
| 76 | +cd ../.. |
| 77 | +``` |
| 78 | + |
| 79 | +#### 2. Frontend Application (demo-app-frontend) |
| 80 | + |
| 81 | +```bash |
| 82 | +cd packages/demo-app-frontend |
| 83 | +npm install |
| 84 | +cd ../.. |
| 85 | +``` |
| 86 | + |
| 87 | +## Running the Project |
| 88 | + |
| 89 | +### Step 1: Start Local Hardhat Network |
| 90 | + |
| 91 | +In a dedicated terminal (leave running): |
| 92 | + |
| 93 | +```bash |
| 94 | +cd packages/trust-anchor-did-ethr |
| 95 | +npx hardhat node |
| 96 | +``` |
| 97 | +### Step 2: Deploy Smart Contracts |
| 98 | + |
| 99 | +In a new terminal: |
| 100 | + |
| 101 | +```bash |
| 102 | +cd packages/trust-anchor-did-ethr |
| 103 | + |
| 104 | +# Deploy using Hardhat Ignition |
| 105 | +npx hardhat ignition deploy ignition/modules/CompanyCRSet.ts --network localhost |
| 106 | +``` |
| 107 | + |
| 108 | +You'll see output like this (addresses will vary): |
| 109 | +``` |
| 110 | +[ CompanyCRSetModule ] successfully deployed 🚀 |
| 111 | +
|
| 112 | +Deployed Addresses |
| 113 | +
|
| 114 | +CompanyCRSetModule#EthereumDIDRegistry - 0xabcd...1234 |
| 115 | +CompanyCRSetModule#DIDMultisigController - 0xef01...5678 |
| 116 | +CompanyCRSetModule#CompanyCRSetRegistry - 0x9abc...def0 |
| 117 | +``` |
| 118 | + |
| 119 | +**Copy YOUR three addresses** from the terminal - you'll need them in the next step. |
| 120 | + |
| 121 | +> **Important**: Addresses are network-specific. Localhost addresses will differ from Sepolia/mainnet deployments. |
| 122 | +
|
| 123 | +### Step 3: Configure Frontend Environment |
| 124 | + |
| 125 | +In `packages/demo-app-frontend`, **first create** a `.env` file by copying from `.env.example`: |
| 126 | + |
| 127 | +```bash |
| 128 | +cp .env.example .env |
| 129 | +``` |
| 130 | + |
| 131 | +Then **edit the `.env` file** and replace the placeholders with **your actual addresses** from the deployment output above: |
| 132 | + |
| 133 | +```env |
| 134 | +# Replace these with YOUR addresses from the deployment step: |
| 135 | +VITE_TRUST_ANCHOR_ADDRESS=<your_DIDMultisigController_address> # ← DIDMultisigController |
| 136 | +VITE_REGISTRY_ADDRESS=<your_EthereumDIDRegistry_address> # ← EthereumDIDRegistry |
| 137 | +VITE_CRSET_REGISTRY_ADDRESS=<your_CompanyCRSetRegistry_address> # ← CompanyCRSetRegistry |
| 138 | +VITE_PINATA_JWT=your_pinata_jwt_token |
| 139 | +
|
| 140 | +# Local Hardhat RPC |
| 141 | +VITE_HARDHAT_RPC_URL=http://127.0.0.1:8545 |
| 142 | +``` |
| 143 | + |
| 144 | +**Optional**: If you don't have a Pinata account, you can leave `VITE_PINATA_JWT` empty for local testing (some IPFS features may not work). |
| 145 | + |
| 146 | +### Step 4: Import Hardhat Accounts to MetaMask |
| 147 | + |
| 148 | +To interact with the smart contracts through the frontend, you need to import Hardhat test accounts into MetaMask. We recommend importing the first 5 accounts (displayed when hardhat node is started). |
| 149 | + |
| 150 | +**Import to MetaMask:** |
| 151 | + |
| 152 | +1. Open MetaMask extension |
| 153 | +2. Click on account icon → **Import Account** |
| 154 | +3. Select **Private Key** |
| 155 | +4. Paste the Hardhat account private key and click **Import** |
| 156 | + |
| 157 | +**Add Local Hardhat Network to MetaMask:** |
| 158 | + |
| 159 | +1. Open MetaMask → Networks dropdown → **Add Network** |
| 160 | +2. Click **Add a network manually** and save: |
| 161 | + - **Network Name**: Hardhat Local |
| 162 | + - **RPC URL**: `http://127.0.0.1:8545` |
| 163 | + - **Chain ID**: `31337` |
| 164 | + - **Currency Symbol**: ETH |
| 165 | +3. Switch to "Hardhat Local" network |
| 166 | + |
| 167 | +### Step 5: Run Frontend Development Server |
| 168 | + |
| 169 | +```bash |
| 170 | +cd packages/demo-app-frontend |
| 171 | +npm run dev |
| 172 | +``` |
| 173 | + |
| 174 | +**Open your browser** and navigate to [http://localhost:5173/](http://localhost:5173/) |
| 175 | + |
| 176 | +## Testing |
| 177 | + |
| 178 | +```bash |
| 179 | +cd packages/trust-anchor-did-ethr |
| 180 | +npx hardhat test |
| 181 | +``` |
| 182 | + |
| 183 | +### Lint Code |
| 184 | + |
| 185 | +```bash |
| 186 | +cd packages/demo-app-frontend |
| 187 | +npm run lint |
| 188 | +``` |
| 189 | + |
| 190 | +## TypeScript Configuration |
| 191 | + |
| 192 | +### Smart Contracts (trust-anchor-did-ethr) |
| 193 | + |
| 194 | +The TypeScript configuration for smart contracts uses: |
| 195 | + |
| 196 | +- **Target**: ES2022 |
| 197 | +- **Module**: Node16 (ESM) |
| 198 | +- **Strict mode**: Enabled |
| 199 | +- **Output directory**: `dist/` |
| 200 | + |
| 201 | +Configuration file: `packages/trust-anchor-did-ethr/tsconfig.json` |
| 202 | + |
| 203 | +### Frontend (demo-app-frontend) |
| 204 | + |
| 205 | +The frontend uses multiple TypeScript configurations: |
| 206 | + |
| 207 | +- `tsconfig.json` - Base configuration |
| 208 | +- `tsconfig.app.json` - Application code |
| 209 | +- `tsconfig.node.json` - Vite configuration files |
| 210 | + |
| 211 | +**Key settings**: |
| 212 | +- **Target**: ES2022 |
| 213 | +- **Module**: ESNext |
| 214 | +- **JSX**: React JSX transform |
| 215 | +- **Strict mode**: Enabled |
| 216 | + |
| 217 | +## Platform-Specific Notes |
| 218 | + |
| 219 | +### Windows |
| 220 | + |
| 221 | +If you encounter PowerShell "execution policy" errors: |
| 222 | +```powershell |
| 223 | +Set-ExecutionPolicy -Scope CurrentUser -ExecutionPolicy RemoteSigned |
| 224 | +``` |
| 225 | + |
| 226 | +## Deployment |
| 227 | + |
| 228 | +### Build Commands |
| 229 | + |
| 230 | +#### Compile Smart Contracts |
| 231 | + |
| 232 | +```bash |
| 233 | +cd packages/trust-anchor-did-ethr |
| 234 | +npx hardhat compile |
| 235 | +``` |
| 236 | + |
| 237 | +**Note:** Compilation happens automatically during deployment, but you can run this explicitly to check for contract errors. |
| 238 | + |
| 239 | +#### Build Frontend for Production |
| 240 | + |
| 241 | +```bash |
| 242 | +cd packages/demo-app-frontend |
| 243 | +npm run build |
| 244 | +``` |
| 245 | + |
| 246 | +This creates an optimized production build in the `dist/` directory, required for Docker deployment and production hosting. |
| 247 | + |
| 248 | +### Docker Deployment (Frontend) |
| 249 | + |
| 250 | +The frontend application can be containerized for production deployment: |
| 251 | + |
| 252 | +```bash |
| 253 | +cd packages/demo-app-frontend |
| 254 | + |
| 255 | +# Build Docker image |
| 256 | +docker build -t ssi-frontend . |
| 257 | + |
| 258 | +# Run container |
| 259 | +docker run -d -p 8080:80 --name ssi-app ssi-frontend |
| 260 | +``` |
| 261 | + |
| 262 | +**Access**: [http://localhost:8080](http://localhost:8080) |
| 263 | + |
| 264 | +**Important**: Environment variables are baked into the build. Ensure your `.env` file is correct before building the Docker image. |
| 265 | + |
| 266 | +### Deploying to Sepolia Testnet |
| 267 | + |
| 268 | +```bash |
| 269 | +cd packages/trust-anchor-did-ethr |
| 270 | + |
| 271 | +# Set private key using keystore |
| 272 | +npx hardhat keystore set SEPOLIA_PRIVATE_KEY |
| 273 | + |
| 274 | +# Deploy to Sepolia |
| 275 | +npx hardhat ignition deploy --network sepolia ignition/modules/TrustAnchor.ts |
| 276 | +npx hardhat ignition deploy --network sepolia ignition/modules/CompanyCRSet.ts |
| 277 | +``` |
| 278 | + |
| 279 | +**Note**: You'll need Sepolia ETH for deployment. Get testnet ETH from a faucet. |
| 280 | + |
| 281 | +## Troubleshooting |
| 282 | + |
| 283 | +### Common Issues |
| 284 | + |
| 285 | +#### "Module not found" errors |
| 286 | + |
| 287 | +Ensure you've installed dependencies in the correct package: |
| 288 | +```bash |
| 289 | +cd packages/FRONTEND_OR_CONTRACT_PACKAGE |
| 290 | +npm install |
| 291 | +``` |
| 292 | + |
| 293 | +#### Hardhat node not accessible |
| 294 | + |
| 295 | +1. Check if port 8545 is already in use |
| 296 | +2. Ensure Hardhat node is running in a separate terminal |
| 297 | +3. Verify `VITE_HARDHAT_RPC_URL=http://127.0.0.1:8545` in `.env` |
| 298 | + |
| 299 | +#### Contract deployment fails |
| 300 | + |
| 301 | +1. Ensure Hardhat node is running |
| 302 | +2. Check you have test accounts with ETH (Hardhat provides default accounts) |
| 303 | +3. Verify network configuration in `hardhat.config.ts` |
| 304 | + |
| 305 | +#### Frontend build fails with TypeScript errors |
| 306 | + |
| 307 | +```bash |
| 308 | +cd packages/demo-app-frontend |
| 309 | +rm -rf node_modules package-lock.json |
| 310 | +npm install |
| 311 | +npm run build |
| 312 | +``` |
| 313 | + |
| 314 | +#### Port 5173 already in use |
| 315 | + |
| 316 | +Kill the process or specify a different port: |
| 317 | +```bash |
| 318 | +npm run dev -- --port 3000 |
| 319 | +``` |
| 320 | + |
| 321 | +#### "Cannot find module '@nomicfoundation/hardhat-toolbox-viem'" |
| 322 | + |
| 323 | +Reinstall Hardhat dependencies: |
| 324 | +```bash |
| 325 | +cd packages/trust-anchor-did-ethr |
| 326 | +npm install |
| 327 | +``` |
| 328 | + |
| 329 | +#### Transaction fails with "nonce too high" or "invalid nonce" after restarting Hardhat |
| 330 | + |
| 331 | +**Cause**: Each time you restart `npx hardhat node`, the blockchain state resets to block 0. However, MetaMask caches the transaction nonce count, causing a mismatch. |
| 332 | + |
| 333 | +**Solution**: Reset your MetaMask account activity: |
| 334 | +1. Open MetaMask |
| 335 | +2. Go to **Settings** → **Advanced** |
| 336 | +3. Click **Clear activity tab data** |
| 337 | +4. Refresh your browser and try the transaction again |
0 commit comments