位置: IT常识 - 正文

小满Vue3第三十六章(Vue如何开发移动端)

编辑:rootadmin
小满Vue3第三十六章(Vue如何开发移动端)

推荐整理分享小满Vue3第三十六章(Vue如何开发移动端),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:,内容如对您有帮助,希望把文章链接给更多的朋友!

视频教程Vue3 + vite + Ts + pinia + 实战 + 源码 +全栈_哔哩哔哩_bilibili

如果使用npm init vue@latest 报错

error when starting dev server: Error: Cannot find module 'node:path'

nodejs 升级为16版本就好了

小满Vue3第三十六章(Vue如何开发移动端)

开发移动端最主要的就是适配各种手机,为此我研究了一套解决方案

在之前我们用的是rem 根据HTML font-size 去做缩放

现在有了更好用的vw vh

vw 视口的最大宽度,1vw等于视口宽度的百分之一

vh 视口的最大高度,1vh等于视口高度的百分之一

1.安装依赖

npm install postcss-px-to-viewport -D

因为vite中已经内联了postcss,所以并不需要额外的创建 postcss.config.js文件

vite.config.ts

import { fileURLToPath, URL } from 'url'import { defineConfig } from 'vite'import vue from '@vitejs/plugin-vue'import vueJsx from '@vitejs/plugin-vue-jsx'import postcsspxtoviewport from "postcss-px-to-viewport" //插件// https://vitejs.dev/config/export default defineConfig({ plugins: [vue(), vueJsx()], css: { postcss: { plugins: [ postcsspxtoviewport({ unitToConvert: 'px', // 要转化的单位 viewportWidth: 750, // UI设计稿的宽度 unitPrecision: 6, // 转换后的精度,即小数点位数 propList: ['*'], // 指定转换的css属性的单位,*代表全部css属性的单位都进行转换 viewportUnit: 'vw', // 指定需要转换成的视窗单位,默认vw fontViewportUnit: 'vw', // 指定字体需要转换成的视窗单位,默认vw selectorBlackList: ['ignore-'], // 指定不转换为视窗单位的类名, minPixelValue: 1, // 默认值1,小于或等于1px则不进行转换 mediaQuery: true, // 是否在媒体查询的css代码中也进行转换,默认false replace: true, // 是否转换后直接更换属性值 landscape: false // 是否处理横屏情况 }) ] } }, resolve: { alias: { '@': fileURLToPath(new URL('./src', import.meta.url)) } }})

如果你用的vite 是 ts 他这个插件并没有提供

本文链接地址:https://www.jiuchutong.com/zhishi/290851.html 转载请保留说明!

上一篇:【今日清明】哀悼为抗击新冠肺炎牺牲的烈士和逝世的同胞 (© Luca Flor/Shutterstock)(清明 哀思)

下一篇:两只玩耍的北极熊,加拿大丘吉尔镇 (© Cheryl Ramalho/Getty Images)(两只小北极熊)

  • 山西税务年度申报在晋税通中怎么申报
  • 分期收款企业所得税调整
  • 报税扣款锁定如何解除
  • 纳税信用等级评定在哪里查询
  • 个人住房5年后买卖如何交税?
  • 什么是一般业务
  • 出售股票税费处理投资收益在贷方
  • 补缴以前年度增值税以及滞纳金
  • 背书承兑分录
  • 跨月的增值税普票作废步骤
  • 小企业出租设备分录
  • 员工宿舍买热水器计入什么费用
  • 出纳购买东西能报销吗
  • 小企业会计准则以前年度损益调整
  • 小企业应付职工薪酬核算内容的有
  • 个人劳务发票怎么交税
  • 出售旧房及建筑物计算土地增值税
  • 企业所得税减半征收政策
  • 小规模纳税人开票税率
  • 建筑设计行业收入调查
  • 全年一次性奖金计税方式
  • 卷式增值税发票校验码怎么查
  • 城市生活垃圾处理费应该交吗
  • 管理费用研发费用科目设置
  • 19年新会计制度
  • 买一赠一怎么确定真假
  • 外贸企业出口退税计算公式
  • 控股公司如何抵押股权
  • 预提费用对应
  • 收据换发票的会计分录
  • 税务发票原件
  • 期货手续费会计分录
  • 工程安装人工外包合同怎么写
  • 预计负债基本确定的概率区间
  • 个体户个人所得税免征额是多少
  • php获取长度
  • 销售货物货款未收的会计分录
  • 销项负数发票应该给谁
  • php的运算符主要包括哪些?
  • 生产设备改良支出计入什么费用
  • 什么叫转登记纳税人
  • 进项税额资产还是负债
  • php读取xml文件
  • websocket怎么读
  • service运行命令
  • php时间戳转换成时间
  • 员工工资属于什么会计科目
  • 应收账款保理会计处理相关会计准则
  • 单位应缴住房公积金
  • 土地使用税的征税范围有哪些
  • 卖固定资产计入
  • 一般纳税人怎样申请简易计税
  • python slic
  • 预收账款可以通过什么科目核算
  • 税控盘开票机号在哪里能查到
  • 排污收费制度在排污费征收方面存在的问题
  • shell取命令执行结果
  • mysql的存储过程怎么理解
  • 专用发票什么意思
  • 哪类企业是可以避税的
  • 银行贷款如何做到量价平衡管理
  • 商场代收款合法吗
  • 差旅费属于什么会计要素
  • 定期存款怎么做
  • windows没有
  • linux滚动更新是什么
  • win8 任务栏
  • javascript的三种主要数据类型
  • jquery easyui开发指南
  • gridview添加数据
  • 批量创建用户
  • 监控网站是否可以删除
  • 使用脚本什么意思
  • 个人进口关税税率
  • 法人没有实名认证,现在要变更,还需要实名认证吗
  • 进口哪些情况要交税
  • 甘肃省国家税务局
  • 哪些账本需要贴纸
  • 税收与税务的区别是什么
  • 计算土地增值税时下列费用准予从收入总额中扣除的有
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设