最近一个需要用nuxt框架实现的pc自适应项目，从网上找了很多资料，最终完美实现

一、下载相关插件

npm i lib-flexible -S
npm i px2rem-loader -D
npm install postcss-px2rem save

二、在plugins文件下新建 lib-flexible.js文件  引入 lib-flexible

三、因为是pc端自适应，所以在 node_modules 文件夹下找到 lib-flexible文件中的 flexible.js

四、在nuxt.config.js 中配置

plugins: [

    {src:'@plugins/lib-flexible.js',ssr:false}

],

　build: {
    postcss: [
      require('postcss-px2rem')({
        remUnit: 192  // 之所以写192是因为设了pc最大宽度1920px
      })
    ],
  }

 好了，大功告成！！！

nuxt.js中引入lib-flexible 和 postcss-px2rem 实现pc自适应的更多相关文章

  1. 在 Node.js 中引入模块：你所需要知道的一切都在这里

    本文作者:Jacob Beltran 编译:胡子大哈 翻译原文:http://huziketang.com/blog/posts/detail?postId=58eaf471a58c240ae35bb ...

  2. js中引入js

    第一个js文件(被引入的js文件),文件名one.js,内容如下 function alertInOne(){    alert('in one');} 第二个js文件,文件名two.js,内容如下 ...

  3. vue.js中引入图片

    vue中引入图片 前言:vue中引入图片时,会显示不出来,除非在css中引入.而在template中或者js动态引入时,会显示不出图片. 解决一 图片通过后端返回引入网络图片路径即可. <div ...

  4. Nuxt.js中scss公用文件(不使用官方插件style-resources)

    项目多多少少应该都遇到有公用文件这种情况,比如说偶尔某一天产品来找你,能不能明天把网站的这个颜色给我改下?第二天再来给我换回来? 如果再css2.x时代,不使用css预处理技术,这一改只能“查找替换” ...

  5. webpack配置less以及js中引入的图片问题

    1.问题重现 当我做了这个配置以后,发现less里的图片可以正常展现到页面,但是js里的图片以及其他文件都不能正常展现,都报404 原始配置如下: // 如果有額外的.babelrc配置的話就可以使用 ...

  6. nuxt.js中登录、注册（密码登录和手机验证码登录）

    <!-- 登录弹框 --> <div class="mask" v-show="flag"> <div class="m ...

  7. vue.js中引入其他文件export的方法：

    import {GetPosition} from '../../lib/utils'  //找到 该方法的文件路径,然后 用{}拿到 该方法 var position =GetPosition(); ...

  8. 如何正确在IDEA 里maven构建的项目中引入lib的jar包（图文详解）

    不多说,直接上干货! 问题详情 以下是我,maven构建出来的最新spark2.2.0-bin-hadoop2.6的项目. 有些依赖包,maven还是无法一次性满足,所以,得手动加入lib的jar包. ...

  9. 关于vue项目中在js中引入图片问题

    <template> <div> <img v-for="(star,index) in stars" :src="star.src&quo ...

随机推荐

  1. Spring boot定义多个配置文件并自由切换

    在resource目录下定义三个配置文件 (properties文件已被我注销,配置文件建议用yml,如果properties文件与yml文件同时存在,SpringBoot会优选加载propertie ...

  2. 一篇文章带你掌握主流服务层框架——SpringMVC

    一篇文章带你掌握主流服务层框架--SpringMVC 在之前的文章中我们已经学习了Spring的基本内容,SpringMVC隶属于Spring的一部分内容 但由于SpringMVC完全针对于服务层使用 ...

  3. 洛谷P3391 文艺平衡树 （Splay模板）

    模板题. 注意标记即可,另外,涉及区间翻转操作,记得设立首尾哨兵. 1 #include<bits/stdc++.h> 2 using namespace std; 3 const int ...

  4. NOI2015 洛谷P1955 程序自动分析（并查集+离散化）

    这可能是我目前做过的最简单的一道noi题目了...... 先对e=1的处理,用并查集:再对e=0查询,如果这两个在同一集合中,则为""NO",最后都满足的话输出" ...

  5. VS中git概念解析与深度使用

    基础概念 四个区 工作区(Working Area) 暂存区(Stage) 本地仓库(Local Repository) 远程仓库(Remote Repository) 五种状态 未修改(Origin ...

  6. 2022年最新最详细的tomcat安装教程和常见问的解决

    文章目录 1.官网直接下载 1.1.jdk的版本和tomcat版本应该相对应或者兼容 1.2. 在官网找对应的tomcat版本进行下载 1.3 .根据电脑版本下载64-bit windows zip( ...

  7. mybatisPlus在Springboot中的使用

    文章目录 1.简介 2.支持的数据库 3.框架 4.创建一个springboot项目 4.1 .pom文件中加入依赖 4.2.yml文件的配置 4.3 .数据库脚本 4.4.实体类 4.5 .启动类添 ...

  8. 齐博x1当前URL标签

    当前URL标签 {:get_url('location')} 当前URL的二维码标签 {:urls('index/qrcode/index')}?url={:urlencode(get_url('lo ...

  9. 二进制安装Dokcer

    写在前边 考虑到很多生产环境是内网,不允许外网访问的.恰好我司正是这种场景,写一篇二进制方式安装Docker的教程,用来帮助实施同事解决容器部署的第一个难关. 本文将以二进制安装方式,在CentOS7 ...

  10. 禁忌搜索算法TSA 旅行商问题TSP python

    import math import random import numpy as np import matplotlib.pyplot as plt from mpl_toolkits.mplot ...