zoukankan      html  css  js  c++  java
  • 初探angluar_01 目录结构分析及初始化项目

    简单说明:angular是模块化的,因此所有功能功能都属于组件

    一.目录结构

      e2e 端到端的测试目录  用来做自动测试的

      node_modules 安装地依赖存放目录,package.json里安装地包将会存放在这里。

      src 应用程序地代存放位置,我们的代码主要存放的位置

        --app.component.html 根组件

        --app.component.scss(可能是css less具体看你在安装创建项目的时候,选的是哪种样式)。

        --app.component.ts

        --app.component.spec.ts

          --以上四个文件属于 根组件

        --app.module.ts 根模块,用于配置模块,组装angular应用

      assets静态资源文件

      environments 环境配置文件

      browserslist 浏览器兼容列表

      favicon.ico 浏览器标签的显示图标

      index.html 主页文件,浏览器访问的就是这个文件

      karma.conf.js 端对端测试文件

      main.ts 整个项目的入口,相当于main函数吧

      polyfills.ts 主要用来导入一些必要的库,首先预加载的文件

      styles.scss 公共样式库

      test.ts 测试的入口文件

      tsconfig.app.json typescript配置文件

      tsconfig.app.spec.json typescript的配置文件

      tslint.json ts的配置文件,似乎是启动任务监视js生成的

    以上是angular的基本目录配置,一般在src/app里面应该建立一个components的文件夹,用于存放组件目录

    二、初始化项目

      1.环境准备

        1.安装nodejs

        2.安装vscode

        3.安装angular cli

          1.查看版本 ng v

          2.控制台输入 npm install -g @angular/cli

      2.新建项目

        ng new 项目名称

          会默认安装依赖。也可以停止,进入angular项目目录,运行 npm install 自行安装  

        进入到新建的目录,然后运行项目测试

          gn serve --open

          当浏览器打开http://localhost:4200/ 显示有这个图标则表示正常

      

  • 相关阅读:
    flex + bison multiple parsers
    Educational Codeforces Round 95 (Rated for Div. 2)
    python学习笔记 day20 序列化模块(二)
    python学习笔记 day20 常用模块(六)
    python 学习笔记 常用模块(五)
    python学习笔记 day19 常用模块(四)
    python学习笔记 day19 常用模块(三)
    python学习笔记 day19 常用模块(二)
    python学习笔记 day19 作业讲解-使用正则表达式实现计算器
    python学习笔记 day19 常用模块
  • 原文地址:https://www.cnblogs.com/yeqifeng2288/p/10659654.html
Copyright © 2011-2022 走看看