多语言展示
当前在线:746今日阅读:167今日分享:16

angular8.0项目构建以及文件讲解(一)

angular作为一个前端框架,目前已经发展到8.0版本成熟,其与vue、react等不同的地方在于虽然也类似的进行了html和js等的混编机制,但是相对而言各机制相对独立,并且有些方面还刻意保留了不少后端语言才有的类继承等特性,那么今天本文就从头开始,给大家讲解一下angular8.0从头开始搭建项目得过程以及搭建完成后其中的文件讲解,也希望各位读者在读完本文之后可以学有所得
工具/原料
1

较为熟悉基本的html/css框架

2

vscode

方法/步骤
2

然后我们就可以开始新建一个项目了,首先我们可以ng new 命令新建一个项目,具体效果如下图所示:运行完左边的命令以后,就会自动生成右边的一个目录,目录位置就是你打开cmd/powershell的文件位置。至于参数方面,也可以从angular官网上查询得到具体详情。

3

等下载完成以后,我们可以看到package.json文件,这个里面的script包含了其中可运行的命令,比如start等等,如下图所示:

4

然后我们就可以运行npm start来运行我们的第一个angular项目,运行后打开本地的4200接口的网页就会看到系统自动给我们生成的默认的页面,如下图所示:

5

当然,作为一个前台的项目,也需要有不少的第三方依赖,这个时候,我们需要使用ng add +模块名称 就可以安装了,期间也会有很多配置方面的确认按钮,安装完以后主页面会有变化,变化为下图所示:

6

根据以上的操作,我们就成功安装完成angular的第一个项目并圆满启动了,是不是觉得很简单呢?接下来我们将继续介绍项目得其他要素,也希望大家可以学有所得,有所收获,谢谢。

注意事项
1

没有网页基础的最好先从w3cschool看起

2

vscode不是必须的,但是用起来很方便

推荐信息