详解webpack+angular2开发环境搭建

前端之家收集整理的这篇文章主要介绍了详解webpack+angular2开发环境搭建前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

刚搭建完一个webpack+angular2环境,由于angular及webpack官网上没有一个折中的搭建方案,所以只能摸索着搭建,中间遇到一些坑,遂总结记录下来,以供交流。

搭建完后的项目初步环境如下:

app.componnet.ts:组件文件。angular2应用是由组件构成,组件控制视图;

{{title}}

My favorite hero is: {{myHero}}

` }) // 使用变量初始化方式 export class AppComponent { title = 'Tour of Heroes'; myHero = 'Windstorm'; }

app.module.ts:应用跟模块。angular是模块化,拥有自己的模块系统,被称为angular模块或NgModules(深入了解);//缺少下述模块引入,会输出"Uncaught reflect-Metadata shim is required when using class decorators"的错误

@NgModule({
imports: [ BrowserModule ],declarations: [ AppComponent ],bootstrap: [ AppComponent ]
})
export class AppModule { }

main.ts:用于引导跟模块启动应用;

index.html:angular应用宿主页面
<!DOCTYPE HTML>
<html lang="zh-CN">

small胖的<a href="/tag/boke/" target="_blank" class="keywords">博客</a>

猜你在找的JavaScript相关文章