vue移动端适配终极解决方案hotcss

先上个链接

https://github.com/imochen/hotcss/tree/master/src


重要文件就是这些,我使用的是sass,下载下来,放到项目目录里,下面是我的(vue-cli3)目录,我在创建项目的时候选择了sass 作为了css的预处理器 。


放进项目之后,要做的是引入hotcss.js 和 px2rem.scss ,先来看一下 px2rem.scss 的内容


就这些东西,需要注意的是,$designWidth 的值 是你ui设计稿的宽度,这里我的设计稿是750;

引入px2rem.scss 的方式 是通过vue.config.js 引入的,vue.config.js的配置这里不多说明,可以去官方文档中查看,以下的引入px2rem.scss 的 vue.config.js ,要注意路径问题。


引入hotcss.js直接在main.js 中引入就可以了,然后用法就是 width:100px 要写成 width:px2rem(100),不用带单位哦,因为在px2rem.scss 中就已经加上rem单位了。


ok!

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容