Angular 2.0 预备库 Angular Starter Kit

我就是我 2022-05-20 08:18 152阅读 0赞

Angular Starter Kit 详细介绍

angular-next-starter-kit 是使用 Angular 1.x 开发的应用准备迁移到 Angular 2.0 的种子项目。

Angular 2.0 引入了一些新概念和设计模式，但是 Angular 2.0 还有几个月才能在生产环境使用。为了能让 Angular 1.x 开发的应用使用 Angular 2.0 的概念和一些技术，就有了 angular-next-starter-kit。

此项目的目标是：

*  专注于应用逻辑：
    
     *  创建一个 `service` 来获取数据  
        
     *  创建一个 `component` 来使用数据
     *  使用更小的组件来 Compose 更大的组件

开发者**不需要**担心：

*  配置 `build system`
 *  配置 `unit tests`, `end-to-end tests`, `code coverage`
 *  提供 `static analysis` 和配置 `typescript`
 *  自动生成 `documentation`

### 特性 ###

*  Complete scaffolding with Angular 1.4.x
 *  Typescript 集成
 *  Webpack 绑定系统，多个加载器 (sass, html, typescript)
 *  Gulp 集成 (currently only one task to provide auto documentation)
 *  Karma 集成 Mocha, Chai，多个浏览器启动器 (Chrome, PhantomJS) 和代码覆盖
 *  Interfaces 和 APIs 可以创建可测试和可复用组件
 *  各种服务接口  
    
    
     *  Http Service
     *  Socket Service using Socket IO
     *  SOAP Service using soap client
     *  Buffer Service using ProtobufJS

### 框架 ###

*  Angular 1.4.x
 *  Bootstrap (sass) 3.3.6
 *  Socket IO Client 1.3.7
 *  Typescript v1.7.5

目录结构：

|-- app                         | Root directory for the application
    |
    |---- common                    | All modules common to the application
    |------ bindingTypes.ts         | Module containing Angular binding types
    |------ component.ts            | Interface for a BaseComponent
    |------ service.ts              | Interfaces for HttpService, SocketService, SoapService and BufferService
    |
    |---- components                | Root directory for all the components. Any component should go in here
    |------ dropdown                | Sample implementation of a component
    |-------- dropdown.html         | Template file for the component using Angular's template syntax
    |-------- dropdown.scss         | Scoped styles for the component. This can now just be `required` in
    |-------- dropdown.spec.ts      | Unit test spec file for the component. This should be local to the component
    |-------- dropdown.ts           | Implementation of the component itself
    |
    |---- core                      | Utility modules that bootstrap the application
    |------ bootstrap.ts            | Loads in all the other utility modules and bootstrap's Angular
    |------ components.ts           | Holds references to all the components
    |------ modules.ts              | Registers all the modules
    |------ services.ts             | Holds references to all the services
    |------ tests.ts                | Imports all the necessary modules needed for testing
    |
    |---- services
    |------ stock-service.ts        | Reference implementation of an HttpService using JSONP
    |
    |---- utilities                 | Any utilities used across the application
    |
    |---- app.d.ts                  | Typescript definition file for the application
    |---- index.html                | Main html file for the application
    |---- index.scss                | Main css file for the application
    |
    |-- build                       | Contains the bundled application
    |-- docs                        | Contains all auto generated documentation 
    |-- fonts                       | Contains application wide fonts
    |-- images                      | Contains application wide images
    |-- gulpfile                    | Gulp task file. Currently only one task to generate documentation is provided
    |-- karma.conf.js               | Configuration file for the karma test runner
    |-- package.json                | Contains NPM dependencies and application commands
    |-- tsconfig.json               | Typescript compiler configuration
    |-- tsd.json                    | Contains references to definitely typed libraries
    |-- tslint.json                 | Configuration used by the tslint-loader 
    |-- webpack.config.js           | Webpack's global configuration file

发表评论取消回复

表情：

评论列表（有 0 条评论，152人围观）

还没有评论，来说两句吧...

相关阅读

相关 Angular------使用IDEA开发Angular

本文章所有内容基于[win10搭建Angular环境并运行hello-world][win10_Angular_hello-world] 1. 相关上一篇文章中我们了

朴灿烈づ我的快乐病毒、/ 2023年01月01日 03:37/ 0 赞/ 375 阅读

相关 Angular

Angular 1.框架背景 Angular 是一个由 Google维护的开源JavaScript框架，用于在HTML和JavaScript中构建Web应用程序，是

阳光穿透心脏的1/2处/ 2022年09月07日 06:25/ 0 赞/ 148 阅读

相关 (二) 从Angular1到Angular2需要的预备知识

1. TypeScript语法与ES6新特性写惯了jQ的话突然从ES5跳到ES6，又是个变形的ES6(TypeScript)，学习成本确实不低。不过笔者也是从ng1直接上手

小咪咪/ 2022年06月16日 03:09/ 0 赞/ 196 阅读

相关 angular2升级angular4

angular2升级到angular4 angular2升级到angular4有必要吗？答案是很有必要。升级到4不会在像angular1升级到angular2那样麻烦，而

「爱情、让人受尽委屈。」/ 2022年06月13日 00:53/ 0 赞/ 241 阅读

相关 angular-angular入门（一）

小编我最近做的项目中前端用到了angular，全因心中无货，特来补货。【Angular】 Angular 是一个开发平台。它能帮你更轻松的构建 Web 应用。Angu

ゞ浴缸里的玫瑰/ 2022年05月30日 04:48/ 0 赞/ 264 阅读

相关 Angular 2.0 预备库 Angular Starter Kit

Angular Starter Kit 详细介绍 angular-next-starter-kit 是使用 Angular 1.x 开发的应用准备迁移到 Angular 2.

我就是我/ 2022年05月20日 08:18/ 0 赞/ 153 阅读

相关 angular

转自：[https://blog.csdn.net/qq\_34645412/article/details/77104118][https_blog.csdn.net_qq_

刺骨的言语ヽ痛彻心扉/ 2022年05月09日 11:06/ 0 赞/ 189 阅读

相关 [Angular]Angular基本概念

最近一段时间在研究Angular,今天算是倒腾的差不多了,来聊聊Angular的一些东西. 先来上一张架构图: ![在这里插入图片描述][watermark_type_

不念不忘少年蓝@/ 2022年04月13日 07:49/ 0 赞/ 335 阅读

相关 Angular 学习（二）：Angular 简介

文章目录一、 Angular 介绍 AngularJS 特性

怼烎@/ 2021年09月29日 01:44/ 0 赞/ 741 阅读

相关 Angular--Angular Route导航

前言内容路由的基础知识路由重定向子路由辅助路由路由守卫总结

客官°小女子只卖身不卖艺/ 2021年09月27日 08:02/ 0 赞/ 425 阅读