Angular Toastr 开源项目教程

Angular Toastr 开源项目教程

angular-toastrAngular port of CodeSeven/toastr.项目地址:https://gitcode.com/gh_mirrors/an/angular-toastr

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

angular-toastr/
├── dist/
│   ├── angular-toastr.css
│   ├── angular-toastr.min.css
│   ├── angular-toastr.tpls.js
│   ├── angular-toastr.tpls.min.js
│   ├── angular-toastr.js
│   └── angular-toastr.min.js
├── src/
│   ├── common/
│   │   ├── toast.js
│   │   └── toastContainer.js
│   ├── components/
│   │   ├── toast.css
│   │   ├── toast.less
│   │   ├── toast.tpl.html
│   │   └── toastr.js
│   ├── index.js
│   └── index.tpl.js
├── gulpfile.js
├── package.json
└── README.md

• dist/：包含编译后的文件，可以直接在项目中使用。
• src/：源代码目录，包含项目的核心逻辑和模板。
  • common/：包含通用的服务和指令。
  • components/：包含具体的组件，如样式文件和模板。
  • index.js：项目的入口文件。
  • index.tpl.js：模板入口文件。
• gulpfile.js：Gulp构建脚本。
• package.json：项目的依赖和配置信息。
• README.md：项目说明文档。

2. 项目的启动文件介绍

项目的启动文件是 src/index.js，它负责初始化Angular模块并引入必要的依赖：

import angular from 'angular';
import 'angular-animate';
import 'angular-sanitize';
import './common/toast';
import './common/toastContainer';
import './components/toastr';

const MODULE_NAME = 'angular-toastr';

angular.module(MODULE_NAME, ['ngAnimate', 'ngSanitize']);

export default MODULE_NAME;

3. 项目的配置文件介绍

项目的配置文件主要是 package.json，它包含了项目的依赖、脚本和其他元数据：

{
  "name": "angular-toastr",
  "version": "2.1.1",
  "description": "Angular-toastr is a notification library based on AngularJS and Bootstrap",
  "main": "dist/angular-toastr.tpls.js",
  "scripts": {
    "build": "gulp build",
    "watch": "gulp watch",
    "test": "gulp test"
  },
  "repository": {
    "type": "git",
    "url": "https://github.com/Foxandxss/angular-toastr.git"
  },
  "keywords": [
    "angular",
    "toastr",
    "notification",
    "message",
    "alert",
    "growl"
  ],
  "author": "Jesus Rodriguez",
  "license": "MIT",
  "bugs": {
    "url": "https://github.com/Foxandxss/angular-toastr/issues"
  },
  "homepage": "https://github.com/Foxandxss/angular-toastr",
  "devDependencies": {
    "angular": "^1.5.0",
    "angular-animate": "^1.5.0",
    "angular-mocks": "^1.5.0",
    "angular-sanitize": "^1.5.0",
    "gulp": "^3.9.1",
    "gulp-concat": "^2.6.0",
    "gulp-cssmin": "^0.1.7",
    "gulp-less": "^3.0.5",
    "gulp-rename": "^1.2.2",
    "gulp-uglify": "^1.5.3",
    "jasmine-core": "^2.4.1",
    "karma": "^0.13.22",
    "karma-jasmine": "^0.3.8",
    "karma-phantomjs-launcher": "^1.0.0",
    "phantomjs-prebuilt": "^2.1.7"
  }
}

• name：项目名称。
• version：项目版本。
• description：项目描述。
• main：入口文件。
• scripts：可执行的脚本命令。
• repository：代码仓库信息。
• keywords：项目关键词。
• author：作者信息。
• license：许可证信息。
• devDependencies：开发依赖包。

angular-toastrAngular port of CodeSeven/toastr.项目地址:https://gitcode.com/gh_mirrors/an/angular-toastr