React Native Debugger 使用教程

React Native Debugger 使用教程

react-native-debuggerThe standalone app based on official debugger of React Native, and includes React Inspector / Redux DevTools项目地址:https://gitcode.com/gh_mirrors/re/react-native-debugger

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

React Native Debugger 是一个独立的调试工具，基于 React Native 官方的调试器，并提供了更多的功能。以下是项目的目录结构及其介绍：

react-native-debugger/
├── docs/
│   ├── contributing.md
│   ├── getting-started.md
│   ├── ...
├── src/
│   ├── actions/
│   ├── components/
│   ├── containers/
│   ├── reducers/
│   ├── store/
│   ├── ...
├── .gitignore
├── .npmrc
├── .prettierrc
├── package.json
├── README.md
├── ...

• docs/: 包含项目的文档，如贡献指南、入门指南等。
• src/: 项目的源代码目录，包含动作、组件、容器、Redux 的 reducers 和 store 等。
• .gitignore: 指定 Git 忽略的文件和目录。
• .npmrc: npm 配置文件。
• .prettierrc: Prettier 代码格式化配置文件。
• package.json: 项目依赖和脚本配置文件。
• README.md: 项目介绍和使用说明。

2. 项目的启动文件介绍

React Native Debugger 的启动文件主要位于 src/ 目录下。以下是主要的启动文件及其介绍：

• src/index.js: 项目的入口文件，负责初始化应用和启动调试器。
• src/store/configureStore.js: 配置 Redux store 的文件。
• src/containers/App.js: 应用的主容器组件，包含路由和主要布局。

3. 项目的配置文件介绍

React Native Debugger 的配置文件主要用于项目的构建和运行时的配置。以下是主要的配置文件及其介绍：

• package.json: 包含项目的依赖、脚本和其他配置信息。

  {
    "name": "react-native-debugger",
    "version": "0.11.7",
    "scripts": {
      "start": "react-native start",
      "build": "node scripts/build.js"
    },
    "dependencies": {
      "react": "^16.13.1",
      "react-native": "^0.63.2",
      ...
    },
    "devDependencies": {
      "babel-jest": "^26.0.1",
      "jest": "^26.0.1",
      ...
    }
  }
  

• .prettierrc: Prettier 代码格式化配置文件。

  {
    "singleQuote": true,
    "trailingComma": "all"
  }
  

• .npmrc: npm 配置文件，用于指定 npm 的行为和设置。

  registry=https://registry.npmjs.org/
  

通过以上介绍，您可以更好地理解和使用 React Native Debugger 项目。希望这份教程对您有所帮助。

react-native-debuggerThe standalone app based on official debugger of React Native, and includes React Inspector / Redux DevTools项目地址:https://gitcode.com/gh_mirrors/re/react-native-debugger