ionic项目文件解析

e2e :端对端测试文件。
node_modules : 项目所需的依赖包。
resources : android/ios 资源目录。
src : 开发工作目录,页面,样式,脚本和图片都放在这个目录下。
www : 静态文件,ionic build -prod 生成单页面静态资源文件。
platforms : 生成android或者ios安装包所需的资源–(cordova platform and android后会生成)。
plugins :插件文件夹,里面放置各种cordova安装的插件。
confilg.xml : 打包成app的配置文件。
package.json : 配置项目的元数据和管理项目所需的依赖。
ionic.config.json,ionic.starter.json : ionic的配置文件。
angular.json:angular配置文件 。
karma.conf.js/test.js : 测试相关的配置文件。
polyfils.ts : 这个文件包含Angular需要的填充,并在应用程序之前加载。

ionic 页面创建

ionic g page <name>
可以使用ionic g --help获取帮助
在这里插入图片描述

ionic 自定义公共模块
  1. 创建公共模块及组件

    ionic g module module/slide
    
    ionic g c module/slide
    
  2. 创建成功后,在slide.module.ts中引入组件,并通过exports暴露出去。引入:

    import { FormsModule } from '@angular/forms';
    import { IonicModule } from '@ionic/angular';
    

    在这里插入图片描述

  3. 使用:
    3.1 要使用到的地方引入

    import {SlideModule} from '../modules/slide/slide.module';
    


    3.2 在html页面中使用,直接使用

    <app-slide></app-slide>
    

    这是由组件的selector属性决定的:
    在这里插入图片描述

Logo

开源鸿蒙跨平台开发社区汇聚开发者与厂商,共建“一次开发,多端部署”的开源生态,致力于降低跨端开发门槛,推动万物智联创新。

更多推荐