uni-app学习笔记十八--uni-app static目录简介

本笔记内容摘录自工程简介 | uni-app官网

一个 uni-app 工程,就是一个 Vue 项目,在完成uni-app项目创建后,会生成一个static目录,

  • 为什么需要static这样的目录?

uni-app编译器根据pages.json扫描需要编译的页面,并根据页面引入的js、css合并打包文件。

对于本地的图片、字体、视频、文件等资源,如果可以直接识别,那么也会把这些资源文件打包进去 ,但如果这些资源以变量的方式引用, 比如:<image :src="url"></image>,甚至可能有更复杂的函数计算,此时编译器无法分析。

那么有了static目录,编译器就会把这个目录整体复制到最终编译包内。这样只要运行时确实能获取到这个图片,就可以显示。

当然这也带来一个注意事项,如果static里有一些没有使用的废文件,也会被打包到编译包里,造成体积变大。

另外注意,static目录支持特殊的平台子目录,比如web、app、mp-weixin等,这些目录存放专有平台的文件,这些平台的文件在打包其他平台时不会被包含。详见条件编译

static 目录下的文件(vue组件、js、css 等)只有被引用时,才会被打包编译。

**cssless/scss 等资源不要放在 static 目录下,建议这些公用的资源放在自建的 common 目录下。**所以注意控制static目录的大小,太大的static目录和太多文件,会造成App安装后第一次启动变慢。

相关推荐
白远山12 分钟前
上海24小时自助健身房系统软件开发实战指南
java·架构·uni-app·需求分析
pddqjd16 分钟前
顺德区中考美术集训画室概念释义与核心服务要点梳理
学习
传奇开心果编程44 分钟前
【Jetpack Compose基础语法学与练】第7课 if条件渲染 + 列表基础(LazyColumn)
学习·ui·kotlin·android jetpack
Rabitebla1 小时前
【Linux系统编程】 指令(二):一条路径是怎么定位到文件的
linux·c++·笔记·学习·算法
库玛西1 小时前
数据结构与算法之美:树、森林与二叉树全解析
c语言·数据结构·笔记·考研·算法·学习方法
小贺儿开发1 小时前
Unity 结合百度AI开放平台 手写文字识别
人工智能·科技·学习·unity·云服务·文字识别·手写文字
传奇开心果编程1 小时前
【SwiftUI入门练中学】第1课 从零开始
学习·ui·ios·swiftui·swift
是隼人2 小时前
buuctf-pwn ciscn_2019_sw_1(32位只有一次格式化机会)题解(学习过程持续更新)
c语言·学习·安全·pwn入门·ctf入门
传奇开心果编程2 小时前
【Jetpack Compose基础语法学与练】第9课 SideEffect副作用 + LaunchedEffect,处理异步任务和生命周期
android·学习·ui·kotlin·android jetpack
传奇开心果编程2 小时前
【ArkUI 练中学】第14课:应用性能优化实战
学习·ui·华为·harmonyos