Angular4实战项目搭建经验分享

"浅谈angular4实际项目搭建总结" 本文主要探讨了作者在使用Angular 4进行实际项目构建过程中的经验和总结。作者在接手一个PC端后台项目时，选择了Angular 4作为框架，因为作者对Angular有一定的熟悉度，尤其是之前的经验在Angular 1上，同时也考虑到TypeScript对团队中Android开发者的友好性。在项目开始之前，作者对Angular 2和4有过官方Demo的学习，但认为只有在实际项目中应用才能真正掌握。 在项目搭建初期，作者面临了许多挑战，例如使用Angular CLI创建项目并完善其功能，理解和配置整个框架结构，以及设置基本功能和依赖。这些工作包括环境部署、路由嵌套、主页面布局（如侧边栏、导航栏、内容区和底部）的实现，以及公共服务的构建，如加载指示器、HTTP请求封装、全局标题管理和用户信息存储。 在遇到的具体问题中，作者提到了以下几点： 1. SCSS样式：在Angular CLI配置中将`styleExt`设为`scss`后，组件内的样式不会自动编译为CSS。解决方法是将样式放在独立的SCSS文件中，并通过`styleUrls`引入。 2. 路由配置：路由路径`routes`前不应添加`/`，否则会导致错误。正确的配置方式如下： ```typescript const routes: Routes = [ { path: '', redirectTo: '/main', pathMatch: 'full' }, { path: 'main', component: MainComponent }, ]; ``` 3. `router-outlet`的使用：`<router-outlet>`是路由组件的占位符，当通过路由访问组件时，组件的selector会匹配到`<router-outlet>`。 在整个过程中，作者和团队成员共同学习和进步，尽管初期有些不确定，但最终在预期时间内完成了框架的搭建，对此感到满意。作者对同行分享的资源和代码表示感激，并指出团队中同事的学习速度很快，这对项目的顺利进行起到了积极的推动作用。 这篇摘要揭示了Angular 4在实际项目中的应用，强调了实际操作对于学习框架的重要性，以及在项目搭建中可能会遇到的问题及其解决方案。同时，也展示了团队合作和持续学习在软件开发中的价值。