先分清你要改哪类模板
uni-app项目里“模板”通常指三种东西：页面级.vue文件、组件模板、以及pages.json中的窗口样式配置。改之前先确认目标，否则容易改错地方。
- 页面模板：位于
pages/目录，如pages/index/index.vue - 组件模板：位于
components/目录，可被多个页面复用 - 全局样式：
uni.scss与App.vue中的公共样式
修改页面模板的完整步骤
定位文件
在HBuilderX左侧目录树展开pages，找到对应页面文件夹。若使用CLI创建的项目，结构相同，用编辑器打开即可。
修改template结构
打开.vue文件，标签内就是页面结构。增删标签、调整嵌套层级都在这里完成。注意uni-app不支持浏览器端部分HTML标签，优先使用view、text、image等内置组件。
调整script与style
中处理数据与生命周期，中写样式。若样式需要覆盖组件内部，可使用::v-deep或/deep/穿透选择器。
修改全局样式与主题变量
uni.scss中预置了一批变量，如$uni-color-primary。直接改变量值，所有引用该变量的页面会同步生效。这是最省力的换色方式。
$uni-color-primary: #ff6b00;
若只想改单个页面，在页面中直接写具体样式，不要改变量。
条件编译让模板适配多端
同一份模板在不同端表现可能不同。用条件编译可让代码只在指定平台生效。
仅微信小程序显示
注释符号不能写错，#ifdef与#endif必须成对出现，否则编译报错。
改完不生效的常见原因
- 改了错误文件，例如改的是
unpackage下的编译产物，应改源码 - 缓存未清，HBuilderX可尝试重启或清除缓存
- 样式被更高优先级选择器覆盖，检查是否加了
!important或层级过深 - 条件编译平台判断错误，确认当前运行端与
#ifdef一致
建议的修改流程
先备份原文件，再小步修改、及时预览。每改一处就运行一次，确认效果后再继续。这样出问题时能快速定位是哪一步引入的。
掌握以上方法，大部分uni-app模板修改需求都能独立完成。
