ngx-json-viewer 项目教程

ngx-json-viewer 项目教程

ngx-json-viewerJSON formatter and viewer in HTML for Angular项目地址:https://gitcode.com/gh_mirrors/ng/ngx-json-viewer

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

ngx-json-viewer/
├── projects/
│   └── ngx-json-view/
│       ├── src/
│       │   ├── lib/
│       │   │   ├── ngx-json-view.component.css
│       │   │   ├── ngx-json-view.component.html
│       │   │   └── ngx-json-view.component.ts
│       │   ├── public-api.ts
│       │   └── test.ts
│       ├── angular.json
│       ├── package.json
│       ├── tsconfig.json
│       └── tslint.json
├── scripts/
├── .editorconfig
├── .gitignore
├── CHANGELOG.md
├── LICENSE
├── README.md
├── angular.json
├── package.json
├── tsconfig.json
└── tslint.json

目录结构介绍

• projects/ngx-json-view/: 包含项目的主要源代码。
  • src/lib/: 包含组件的源文件，包括样式、模板和 TypeScript 文件。
  • public-api.ts: 项目的公共 API 入口。
  • test.ts: 测试配置文件。
• scripts/: 包含项目的脚本文件。
• angular.json: Angular 项目的配置文件。
• package.json: 项目的依赖和脚本配置文件。
• tsconfig.json: TypeScript 编译配置文件。
• tslint.json: TSLint 配置文件。

2. 项目的启动文件介绍

项目的启动文件主要是 angular.json 和 package.json。

angular.json

angular.json 是 Angular 项目的配置文件，包含了项目的构建、测试和部署的配置信息。

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "version": 1,
  "newProjectRoot": "projects",
  "projects": {
    "ngx-json-view": {
      "projectType": "library",
      "root": "projects/ngx-json-view",
      "sourceRoot": "projects/ngx-json-view/src",
      "prefix": "lib",
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-ng-packagr:build",
          "options": {
            "tsConfig": "projects/ngx-json-view/tsconfig.lib.json",
            "project": "projects/ngx-json-view/ng-package.json"
          },
          "configurations": {
            "production": {
              "tsConfig": "projects/ngx-json-view/tsconfig.lib.prod.json"
            }
          }
        },
        "test": {
          "builder": "@angular-devkit/build-angular:karma",
          "options": {
            "main": "projects/ngx-json-view/src/test.ts",
            "tsConfig": "projects/ngx-json-view/tsconfig.spec.json",
            "karmaConfig": "projects/ngx-json-view/karma.conf.js"
          }
        },
        "lint": {
          "builder": "@angular-devkit/build-angular:tslint",
          "options": {
            "tsConfig": [
              "projects/ngx-json-view/tsconfig.lib.json",
              "projects/ngx-json-view/tsconfig.spec.json"
            ],
            "exclude": [
              "**/node_modules/**"
            ]
          }
        }
      }
    }
  }
}

package.json

package.json 包含了项目的依赖和脚本配置。

{
  "name": "ngx-json-viewer",
  "version": "1.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "

ngx-json-viewerJSON formatter and viewer in HTML for Angular项目地址:https://gitcode.com/gh_mirrors/ng/ngx-json-viewer