angularjs开发环境搭建

Angularjs是一个前端页面应用开发框架,其使用TypeScript作为开发语言,Angularjs的特性包括,使用组件、模板以及依赖注入的开发框架构建可扩展的web应用,使用易于集成的类库支持页面路由、页面表单、前后端接口交互等各种不同特性,使用各种不同的工具集支持项目工程的开发、构建、测试以及更新应用代码。

开发环境搭建

npm install -g @angular/cli

 

angularjs开发环境搭建_第1张图片

如上所示,在本地开发环境中,使用nodejs运行时环境、使用包管理工具npm安装angularjs开发环境支撑工具集

npm init @angular test2023

或者ng new test2023

angularjs开发环境搭建_第2张图片

angularjs开发环境搭建_第3张图片

angularjs开发环境搭建_第4张图片

如上所示,在本地开发环境中,使用nodejs运行时环境、使用包管理工具npm新建一个angularjs项目工程test2023成功、node_modules中包括项目工程依赖支持的类库

npm start

或者ng serve –open

angularjs开发环境搭建_第5张图片

angularjs开发环境搭建_第6张图片

如上所示,在本地开发环境中,使用包管理工具 npm启动构建、运行项目工程test2023成功、在浏览器中访问本地运行的项目工程test2023响应成功

项目工程构建

ng build

angularjs开发环境搭建_第7张图片

angularjs开发环境搭建_第8张图片

angularjs开发环境搭建_第9张图片

如上所示,在本地开发环境中,使用angularjs的开发工具集构建项目工程test2023、可使用dist目录下构建的项目工程test2023部署到web运行时环境中

代码开发工具

angularjs开发环境搭建_第10张图片

angularjs开发环境搭建_第11张图片

如上所示,在本地开发环境中,使用visual studio code代码编辑工具在test2023项目工程中执行开发任务、在nodejs运行时环境中运行项目工程test2023成功

你可能感兴趣的:(前端技术与架构,angular.js,前端,javascript)