1、安装 flexible和 postcss-px2rem自适应的开发方式下，仍然可以如此：你在设计图上量到的像素（px）是多少你就可以写多少px。很方便你开发项目哦有图有代码，简单明了npm 同时装下面2个东西，你也可以分开装。npm i lib-flexible postcss-px2rem --save先介绍一下flexible效果和作用flexible会为页面根据屏幕自动添加标签，动态控
转载
2024-07-02 15:45:34
119阅读
在vue-cli3.0中使用postcss-plugin-px2rem插件插件的作用是 自动将vue项目中的px转换为rempostcss-plugin-px2rem优势： 因为 postcss-plugin-px2rem 这个插件 配置选项上有 exclude 属性，它可以配置 是否对 某个文件夹下的所有css文件不进行从px到rem的转换。 所以我们可以利用这个特性，把项目中的 node_module 文件夹排除掉。这样如果我们项目中是用了，前端UI框架的话，就不会吧UI框架（...
原创
2021-04-06 16:25:15
3876阅读
在vue-cli3.0中使用postcss-plugin-px2rem插件插件的作用是 自动将vue项目中的px转换为rempostcss-plugin-px2rem优势：
原创
2021-04-06 16:25:15
1581阅读
如何在vue-cli3.0中使用postcss-plugin-px2rem 插件
插件的作用是 自动将vue项目中的px转换为rem 。
转载
2022-04-21 11:45:30
3354阅读
postcss.config.js 文件的数据格式问题在我配置vue项目时，需要用vue-loader配合postcss-loader做配置时，发现了本项目存在的一个问题：我在postcss.config.js中配置了parser:'postcss-scss'，这里在未配置vue-loader之前，只有css,scss,less的rule有引用该配置，而且是通过options.config.pat
转载
2024-04-09 14:16:20
72阅读
作者：幻灵尔依我想你每天写css代码有时候也会觉得很痛苦：这个布局的css怎么这么难实现！我也经常会有这种感觉，一个看似简单的布局总是要琢磨半天才能实现，偶尔还会出现一些怪异的超出理解的现象。这是因为我们对css只是大概知道个形，并没有看透css的本质。在同事的推荐下我阅读了张鑫旭老师的《css世界》，才发现css跟想象中的不太一样。本文为《css世界》个人总结笔记，为缩减篇幅丢弃了张老师冗余
转载
2024-08-17 23:20:46
47阅读
今天，我们使用Vue CLI3 做一个移动端适配 。前言首先确定你的项目是Vue CLI3版本以上的。一、移动端适配包1、安装移动端适配包npm i lib-flexible -S2、在main.js引入适配包import Vue from 'vue'import App from './App.vue'import 'lib-flexible' // 引入适配包Vu...
原创
2021-08-26 14:41:51
207阅读
今天，我们使用Vue CLI3 做一个移动端适配 。前言首先确定你的项目是Vue CLI3版本以上的u...
原创
2022-03-08 14:55:17
240阅读
一、echarts：1、集成步骤：（1）安装echarts:npm install echarts -S（2）main.js中引入：import echarts from 'echarts';
import china from 'echarts/map/json/china.json';
echarts.registerMap('china', china);
Vue.prototype.$ec
（注：本文适用于有一定Vue基础或开发经验的读者，文章就知识点的讲解不一定全面，但却是开发过程中很实用的） 首先介绍一下混入mixin的概念：官方文档：混入提供了一种非常灵活的方式，来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时，所有混入对象的选项将被“混合”进入该组件本身的选项。个人理解：混入就是用来对vue组件中的公共部分，包括
CLI，俗称脚手架。全称是Command Line Interface。 vue-cli 是vue官方发布的开发vue项目的脚手架。vue脚手架用于自动生成vue和webpack的项目模板，是一个快速构建vue项目的工具，可以自动安装vue所需要的插件，避免手动安装各种插件、逐个引入的麻烦。以及自动配置webpack，之前我们都是手动配置webpack。首先是特别的繁琐，而且有一个很明显的问题是版
转载
2024-04-13 20:45:24
6阅读
一、安装插件npm i postcss-pxtorem lib-flexible -D二、postcss.config.jsmodule.exports = { plugins: { 'autoprefixer': { browsers: ['Android >= 4.0', 'iOS >= 8'] }, '...
原创
2022-01-10 15:42:42
134阅读
vue.config.js
原创
2021-07-07 16:57:09
342阅读
1、安装 postcss-px2rem 插件
npm i postcss-px2rem --save-dev2、在webpack.config.js文件中配置。备注：项目这样配置后，整个项目中的css样式中px单位，都会进行换算
const px2rem = require('postcss-px2rem');
new webpack.LoaderOptionsPlugin({
vue:
原创
2023-04-07 09:57:14
4150阅读
PostCss：css工程化处理器、css后处理器 PostCss本身是一个功能比较单一的工具。它提供了一种方式用Javascipt代码来处理CSS。利用PostCss可以实现一些工程化的操作，如：自动添加浏览器前缀，代码合并，代码压缩等。 官网地址：https：//postcss.org/ 安装：1.安装node环境2.npm install postcss-cli -g（全局）3.-o（普通c
感谢大神无私奉献，亲测可用！特分享！！1，安装 flexible和 postcss-px2rem（命令行安装）npm install lib-flexible --savenpm install postcss-px2rem --save简要介绍这两个包的用途：flexible会为页面根据屏幕自动添加<meta name='viewport' >标签，动态控制in...
转载
2021-08-13 18:31:33
339阅读
大前端基础之宽高度自适应 网页布局中经常要定义元素的宽和高。但很多时候我们希望元素的大小能够根据窗口或子元素自动调整，这就是pc自适应。 宽高自适应的优点：元素自适应在网页布局中非常重要，它能够使网页显示更灵活，可以适应在不同设备、不同窗口和不同分辨率下显示。 下面我总结了layout中几种常见的宽高自适应的解决方法。 一、 相对窗口和父元素的自适应写法： 宽度：当块状元素不写宽度的时候，默认的宽
设计模式结构型模式外观模式：为子系统中的一组接口提供一个统一的高层接口，使子系统更容易使用。代理模式：如ES6的Proxy。解决以下问题：增加对一个对象的访问控制当访问一个对象的过程中需要增加额外的逻辑实现需要的条件：真实对象代理对象接口创建型模式工厂模式：制造其他对象的对象，随着传入工厂对象参数的不同有所区别。提供一种集中化、统一化的方式，避免了分散创建对象导致的代码重复、灵活性差的问题。用处：
postcss-px2rem-exclude的失效问题解决记录 ...
转载
2021-07-30 14:08:00
3271阅读
2评论
首先安装插件：npm install postcss-px2rem px2rem-loader --save 在src下新建utils文件夹，在utils下新建rem.js //utils->rem.js // rem等比适配配置文件 // 基准大小 const baseSize = 16 // 设 ...
转载
2021-08-30 14:45:00
536阅读
2评论
