Bigcapital 开源项目使用教程

1. 项目的目录结构及介绍

Bigcapital 项目的目录结构如下：

bigcapital/
├── docker-compose.yml
├── lerna.json
├── package.json
├── playwright.config.ts
├── pnpm-lock.yaml
├── pnpm-workspace.yaml
├── vercel.json
├── src/
│   ├── components/
│   ├── pages/
│   ├── styles/
│   ├── utils/
│   └── index.ts
├── public/
│   ├── images/
│   ├── fonts/
│   └── index.html
└── README.md

目录结构介绍

• docker-compose.yml: Docker 配置文件，用于定义和运行多容器 Docker 应用程序。
• lerna.json: Lerna 配置文件，用于管理多个包的 JavaScript 项目。
• package.json: Node.js 项目的配置文件，包含项目依赖、脚本等信息。
• playwright.config.ts: Playwright 配置文件，用于自动化浏览器测试。
• pnpm-lock.yaml: pnpm 锁定文件，记录项目依赖的确切版本。
• pnpm-workspace.yaml: pnpm 工作区配置文件，用于管理多个包的工作区。
• vercel.json: Vercel 配置文件，用于部署和配置 Vercel 项目。
• src/: 源代码目录，包含项目的所有源代码文件。
  • components/: 存放 React 组件。
  • pages/: 存放页面组件。
  • styles/: 存放样式文件。
  • utils/: 存放工具函数。
  • index.ts: 项目入口文件。
• public/: 公共资源目录，包含静态文件如图片和字体。
  • images/: 存放图片文件。
  • fonts/: 存放字体文件。
  • index.html: 项目的主 HTML 文件。
• README.md: 项目说明文档。

2. 项目的启动文件介绍

项目的启动文件是 src/index.ts，它是整个应用程序的入口点。该文件负责初始化应用程序并启动服务。

src/index.ts 文件介绍

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';

ReactDOM.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
  document.getElementById('root')
);

• import React from 'react': 导入 React 库。
• import ReactDOM from 'react-dom': 导入 ReactDOM 库，用于将 React 组件渲染到 DOM 中。
• import App from './App': 导入主应用程序组件。
• ReactDOM.render(...): 将 App 组件渲染到 DOM 中的 root 元素。

3. 项目的配置文件介绍

docker-compose.yml

version: '3.8'
services:
  web:
    image: bigcapitalhq/bigcapital
    ports:
      - "3000:3000"
    volumes:
      - ./src:/app/src
    environment:
      - NODE_ENV=production

• version: '3.8': 指定 Docker Compose 文件的版本。
• services: web: 定义一个服务 web。
  • image: bigcapitalhq/bigcapital: 指定使用的 Docker 镜像。
  • ports: - "3000:3000": 映射端口，将主机的 3000 端口映射到容器的 3000 端口。
  • volumes: - ./src:/app/src: 挂载卷，将主机的 src 目录挂载到容器的 /app/src 目录。
  • environment: - NODE_ENV=production: 设置环境变量 NODE_ENV 为 production。

package.json

{
  "name": "bigcapital",
  "version": "1.0.0",
  "scripts": {
    "start": "node index.js",
    "build": "webpack",
    "test