pnpm build command builds the project into optimized code for deployment to production environments. It compiles TypeScript to JavaScript and removes unnecessary code to improve execution speed.
Basic Usage
dist directory.
Subcommands
You can build API and Web separately.| Command | Description |
|---|---|
pnpm build | Full API + Web build (default, skips Web build if no Web directory) |
pnpm build api | Build API project only |
pnpm build web | Build Web project only |
my-project/dist/ - Build outputJS
index.jsmodels/api/src/ - Original sourceJSON
package.jsonBuild Process
The build proceeds in the following steps:1. Remove Existing Build Artifacts
Cleanly removes residual files from previous builds.dist/- API build outputweb/dist/- Web build outputweb-dist/- Copied Web output
2. Prepare SWC Configuration
Determines the SWC configuration file to use for the build.3. Build API Project
Compiles TypeScript to JavaScript.4. Build Web Project (Optional)
If a Web project exists, builds it and copies to the API project.
Web build output:
web/dist/- Original build resultweb-dist/- Copy for serving from API server
Build Configuration
Customizing SWC Configuration
Create a.swcrc file in the project root to customize the build.
.swcrc
| Option | Description | Default |
|---|---|---|
target | Compilation target | es2022 |
decorators | Decorator support | true |
sourceMaps | Generate source maps | true |
keepClassNames | Preserve class names | true |
Build Output
API Build Result
dist/JS
index.js - Entry pointmodels/ - Model filesJS
user.model.jsJS
post.model.jsapi/ - API logicJS
sonamu.jsentities/ - Entity definitionsJS
entities.jspractices/ - Practice scriptsJS
p1-test.js- TypeScript β JavaScript conversion
- Decorator transformation complete
- Source maps included (
.js.map) - Import path resolution complete
Web Build Result (Optional)
web-dist/HTML
index.html - HTML entryassets/ - Optimized assetsJS
index-abc123.jsCSS
index-def456.cssICO
favicon.ico- Code minification
- Asset hashing (cache busting)
- Tree shaking (remove unused code)
Build Optimization
1. Separate Type Checking
To speed up builds, perform type checking separately.2. Incremental Builds
Use the development server to rebuild only changed files.3. Cache Utilization
SWC automatically uses build cache.Troubleshooting
Build Failure
Problem: Build fails with TypeScript errorSWC Configuration Error
Problem:.swcrc configuration error
Web Build Failure
Problem: Vite build errorRunning After Build
After build completes, run the production server with thestart command.
- Fast startup: Run pre-compiled JavaScript
- Low memory: No TypeScript transformation overhead
- Source map support: Show original file location on errors
Direct Execution
You can also run directly with Node.js instead ofpnpm start:
--enable-source-maps: Show original TypeScript file location on errorsdist/index.js: Built entry point
Loading Environment Variables
When environment variables are needed:CI/CD Configuration
Setting up CI/CD pipelines enables automatic building and deployment whenever code is pushed. Various tools like GitHub Actions, GitLab CI, Jenkins, etc. can be used.Why is CI/CD Needed?
| Benefit | Description |
|---|---|
| Automation | Eliminate manual build/deploy tasks |
| Consistency | Always build the same way |
| Fast feedback | Immediately detect build failures |
| Safety | Deploy only after tests pass |
| Traceability | Preserve all deployment records |
GitHub Actions
GitHub Actions is a CI/CD platform integrated with GitHub. Define workflows by writing YAML files in the.github/workflows/ directory.
.github/workflows/deploy.yml
Setup Node.js
Install Node.js and enable pnpm cache with
actions/setup-node@v3.
Cache makes dependency installation much faster.Adding Tests
Run tests before deployment to catch bugs early:.github/workflows/deploy.yml
Environment-based Deployment
Separate Staging and Production environments:Docker
Using Docker guarantees a consistent execution environment. Development, staging, and production all run in the same environment.Dockerfile
| Benefit | Description |
|---|---|
| Small image size | Exclude build tools from final image |
| Fast deployment | Smaller images have faster pull/push |
| Security | Remove unnecessary development tools |
| Layer caching | Reuse if dependencies unchanged |
Docker Compose
Use Docker Compose to run with database:docker-compose.yml
Performance Comparison
Production builds are much faster and more efficient than development server.| Metric | Development Server | Production Build | Difference |
|---|---|---|---|
| Startup time | 2-3s | 0.5s | 4-6x faster |
| Memory usage | 200MB | 100MB | 50% reduction |
| Request handling | Slower | Faster | 2-3x faster |
| File size | Original | Compressed | 30-50% smaller |
- Pre-compiled: Donβt transform TypeScript in real-time
- Code optimization: Remove unnecessary code, compression
- No HMR overhead: No file watching and reloading costs
- Production mode: Node.js and dependencies run in optimized mode