码迷,mamicode.com
首页 > 移动开发 > 详细

uniapp-网易云-文档结构分析-图标

时间:2021-06-28 18:40:57      阅读:0      评论:0      收藏:0      [点我收藏+]

标签:tar   项目   imp   def   网易云   hbuilder   发布   template   src   

uniapp-网易云-文档结构分析-图标

  • 文档结构

    第一次接触uniapp,对于文档结构还不是非常清晰

    根据个人的想法,不知道自己在干嘛的学习毫无意义,所以我们要先知道自己在干嘛

    技术图片

uni.scss的主要作用是存放定义好的内置常量,学习过安卓app开发的应该清楚,

安卓中也有一个这样的文件,不光是定义颜色,还可以定义文本等

技术图片

pages.json,采用中json数据形势来进行文件配置。

在这样的配置中,感觉很像vue的路由配置,但是暂时未接触到uniapp的父子页面之间的规定方法

这种将页面的样式卸载这个文件中的感觉给我的感觉很像安卓app的页面配置文件,

安卓app采用的是xml数据形式进行配置

为总体的页面配置,也可以为单独的页面设置主体样式,还可以设置该页面在不同设备上的单独效果

非常灵活,简单

技术图片

APP.vue为主界面,main.js为入口程序,在其中导入组件等,和vue非常相似

mainfest.json是程序在不同设备上的配置文件,非常直观,方便

static是静态文件

.hbuilderx是程序在编译器中的配置文件,和大多数程序大同小异

unpackage是程序发布,打包后的配置文件,类似于c#,asp中的debug文件

总体来说uniapp的开发达到了非常简单的程度,你想要的东西一目了然

  • 字体图标

技术图片需要剪切的文件在上图中就可以看到

阿里图标网站
https://www.iconfont.cn/
这里建议直接在源代码中直接复制需要拷贝的文件就可以了,在以后自己的开发使用自己寻找的图标

放置好文件之后,创建common文件夹,将上图中的iconfont.css放在里面

这个文件夹是放置项目公共资源的文件夹,里面一般是方式大家都可以使用的一些方法等,在vue中也就是js文件

这个文件应该是索引static中的资源,

将资源样式设置为处理好的样式,使用的时候使用这个样式而不是资源

<template>
	<view>
		11<text class="iconfont iconlike"></text>
	</view>
</template>

<script>
	import ‘@/common/iconfont.css‘;
	export default {

导入文件后,使用该class即可

uniapp-网易云-文档结构分析-图标

标签:tar   项目   imp   def   网易云   hbuilder   发布   template   src   

原文地址:https://www.cnblogs.com/ju-ruo/p/14934291.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!