ReScript React 项目教程

ReScript React 项目教程

rescript-reactOfficial ReScript bindings for ReactJS项目地址:https://gitcode.com/gh_mirrors/re/rescript-react

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

ReScript React 项目的目录结构如下：

rescript-react/
├── .github/
│   └── workflows/
├── src/
├── .gitattributes
├── .gitignore
├── .npmignore
├── CHANGELOG.md
├── LICENSE
├── README.md
├── package-lock.json
├── package.json
├── rescript.json

目录介绍

• .github/workflows: 包含 GitHub Actions 的工作流配置文件。
• src: 项目的源代码目录。
• .gitattributes: Git 属性配置文件。
• .gitignore: Git 忽略文件配置。
• .npmignore: npm 发布时忽略的文件配置。
• CHANGELOG.md: 项目更新日志。
• LICENSE: 项目许可证。
• README.md: 项目说明文档。
• package-lock.json: npm 依赖锁定文件。
• package.json: 项目配置文件，包含依赖、脚本等信息。
• rescript.json: ReScript 编译器配置文件。

2. 项目的启动文件介绍

项目的启动文件位于 src 目录下，通常包含以下文件：

• Index.res: 项目的入口文件，负责初始化 React 应用。
• App.res: 应用的主要组件，包含路由和全局状态管理等。

启动文件介绍

• Index.res:

  ReactDOM.render(<App />, document.getElementById("root"))
  

• App.res:

  module App = {
    @react.component
    let make = () => {
      <div>
        <h1> {"Hello, ReScript React!" -> React.string} </h1>
      </div>
    }
  }
  

3. 项目的配置文件介绍

package.json

package.json 文件包含了项目的元数据和依赖信息：

{
  "name": "rescript-react",
  "version": "1.0.0",
  "scripts": {
    "start": "rescript build -w"
  },
  "dependencies": {
    "rescript": "^9.1.4",
    "rescript-react": "^0.10.3"
  }
}

rescript.json

rescript.json 文件是 ReScript 编译器的配置文件：

{
  "name": "rescript-react",
  "sources": [
    {
      "dir": "src",
      "subdirs": true
    }
  ],
  "package-specs": {
    "module": "commonjs",
    "in-source": true
  },
  "suffix": ".bs.js"
}

以上是 ReScript React 项目的基本教程，涵盖了项目的目录结构、启动文件和配置文件的介绍。希望对你有所帮助！

rescript-reactOfficial ReScript bindings for ReactJS项目地址:https://gitcode.com/gh_mirrors/re/rescript-react