vue-cli怎么配置lib-flexible+rem移动端自适应
Vue +H5项目配置 rem 移动端适配。提示： 如果项目使用了第三方的UI组件库（文本以 VantUI 为例），而又不想让组件库的 px 转为 rem ，则需要安装 postcss-px2rem-exclude 。
在main.js中导入lib-fixible.如果未使用vue的伙伴可以直接在前端中直接使用阿里的CDN，如下：注：此处是postcss-px2rem而不是px2rem-loader，网上很多文章都引用是后者，会导致在配置时候无法成功配置。
关于lib-flexible和px2rem的配置，请移步 vue-cli 配置 flexible 。由于使用rem作适配，导致现有的很多移动端UI框架不能与之很好的配合，往往需要大动干戈更改UI框架的样式，背离了使用UI框架达到快速开发的初衷。
在Vue项目 src文件夹内新建 utils文件夹=index.js。
如何前端Vue实现一个PC端/移动端兼备的网页
1、step vue安装postcss-px-to-viewport插件。
2、自适应网页：通过对不同分辨率设置不同的样式效果，可以让网页兼容pc和移动端，此方式不适合大型的平台。一般的企业站和个人站可以使用这样的方式。分别建立pc端和移动端。两个网站分别对应pc和移动端。
3、另一方面，Vue 完全有能力驱动采用单文件组件和 Vue 生态系统支持的库开发的复杂单页应用，实现PC端单页式的前端开发。
4、那么前端如果是一个PC网站如果要考虑兼容性，那么用的相对比较多的其实还是jquery。但是在目前大多数浏览器都能支持比较新的技术的背景下，其实不需要考虑太多兼容性的问题，那么现在我们大多使用vue进行前端开发。
5、我们知道，有些项目是需要在PC端用Vue实现此功能。
基于Vue的PC和移动端适配的实现方案
首先，我们先使用vue-cli创建一个初始化的vue项目。当项目创建好以后，我们在根目录下新建一个 vue.config.js ，想必大家也都懂这个文件是干什么的。
Vue +H5项目配置 rem 移动端适配。提示： 如果项目使用了第三方的UI组件库（文本以 VantUI 为例），而又不想让组件库的 px 转为 rem ，则需要安装 postcss-px2rem-exclude 。
在app.vue 判断是否用pc打开，如果是将 html的字体设置55px，当然移动端的单位都是使用rem的前提。
font-size == viewport width)，之后的布局单位全部使用rem来实现整体缩放。在使用动态 rem 布局的移动端页面中，很小的宽度如border-width 依然使用px，因为即使使用rem，当rem小于1px 时，依然会被浏览器当做1px 使用。
以上便是用Vue实现移动端拖拽组件的过程。我们知道，有些项目是需要在PC端用Vue实现此功能。
以上内容为新媒号(sinv.com.cn)为大家提供！新媒号，坚持更新大家所需的前端知识。希望您喜欢！
版权申明：新媒号所有作品（图文、音视频）均由用户自行上传分享，仅供网友学习交流，不声明或保证其内容的正确性，如发现本站有涉嫌抄袭侵权/违法违规的内容。请发送邮件至 k2#88.com(替换@) 举报，一经查实，本站将立刻删除。
