Angular Grid Layout 项目教程

Angular Grid Layout 项目教程

angular-grid-layoutResponsive grid with draggable and resizable items for Angular applications.项目地址:https://gitcode.com/gh_mirrors/an/angular-grid-layout

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

angular-grid-layout/
├── assets/
├── projects/
│   └── angular-grid-layout/
│       ├── src/
│       │   ├── lib/
│       │   │   ├── components/
│       │   │   ├── directives/
│       │   │   ├── models/
│       │   │   ├── services/
│       │   │   └── index.ts
│       │   ├── public-api.ts
│       │   └── test.ts
│       ├── angular.json
│       ├── package.json
│       ├── tsconfig.lib.json
│       ├── tsconfig.spec.json
│       └── tsconfig.json
├── scripts/
├── .editorconfig
├── .eslintrc.json
├── .gitignore
├── .versionrc
├── CHANGELOG.md
├── LICENSE.md
├── README.md
├── angular.json
├── commitlint.config.js
├── package-lock.json
├── package.json
├── tsconfig.json
├── tsconfig.lint.json
└── yarn.lock

目录结构介绍

• assets/: 存放项目资源文件。
• projects/: 包含主要的项目代码。
  • angular-grid-layout/: 主要项目目录。
    • src/: 源代码目录。
      • lib/: 库代码目录。
        • components/: 组件代码。
        • directives/: 指令代码。
        • models/: 模型代码。
        • services/: 服务代码。
        • index.ts: 库的入口文件。
      • public-api.ts: 公共 API 文件。
      • test.ts: 测试配置文件。
    • angular.json: Angular 项目配置文件。
    • package.json: 项目依赖和脚本配置文件。
    • tsconfig.lib.json: 库的 TypeScript 配置文件。
    • tsconfig.spec.json: 测试的 TypeScript 配置文件。
    • tsconfig.json: TypeScript 配置文件。
• scripts/: 存放脚本文件。
• .editorconfig: 编辑器配置文件。
• .eslintrc.json: ESLint 配置文件。
• .gitignore: Git 忽略文件配置。
• .versionrc: 版本控制配置文件。
• CHANGELOG.md: 变更日志文件。
• LICENSE.md: 许可证文件。
• README.md: 项目说明文件。
• angular.json: Angular 项目配置文件。
• commitlint.config.js: commitlint 配置文件。
• package-lock.json: npm 依赖锁定文件。
• package.json: 项目依赖和脚本配置文件。
• tsconfig.json: TypeScript 配置文件。
• tsconfig.lint.json: 代码风格检查配置文件。
• yarn.lock: Yarn 依赖锁定文件。

2. 项目的启动文件介绍

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

angular.json

angular.json 是 Angular 项目的配置文件，包含了项目的构建、开发服务器、测试等配置。

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "version": 1,
  "newProjectRoot": "projects",
  "projects": {
    "angular-grid-layout": {
      "projectType": "library",
      "root": "projects/angular-grid-layout",
      "sourceRoot": "projects/angular-grid-layout/src",
      "prefix": "lib",
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:ng-packagr",
          "options": {
            "project": "projects/angular-grid-layout/ng-package.json"
          },
          "configurations": {
            "production": {
              "tsConfig": "projects/angular-grid-layout/tsconfig.lib.prod.json"
            },
            "development": {
              "tsConfig": "projects/angular-grid-layout/tsconfig.lib.json"
            }
          },
          "defaultConfiguration": "

angular-grid-layoutResponsive grid with draggable and resizable items for Angular applications.项目地址:https://gitcode.com/gh_mirrors/an/angular-grid-layout