首页 > TAG信息列表 > browserslist

uniapp项目运行出现npx browserslist@latest --update-db

今天运行uni-app项目的时候,出现了npx browserslist@latest --update-db 在桌面找到HBuilderX的安装目录, cmd切换到HBuilderX/plugins/uniapp-cli下删除node_modules以及package-lock.json在当前目录执行npm install 然后重新启动项目就可以了

处理css/js兼容性的工具之超重要的browserslist

这篇 webpack处理css资源 文章中使用到的工具 browserslist 对于兼容性处理来说非常重要!这一篇来仔细说说。 查询兼容性 不同浏览器对于 css / js 的属性可能存在兼容性,具体可以通过 can i use 这个网站查询。 比如 css 中的 user-select 属性,用于规定是否可以在浏览器上双击选取

Vue —— 打包时报错:Browserslist: caniuse-lite is outdated. Please run next command `npm update`

报错提示: browserslist 和 caniuse-list版本低,更新即可 更新: npm update caniuse-lite 如果执行完上面的命令,打包还报上面的错,那就把本地的node_module文件中的browserslist和caniuse-lite文件删除掉,重新执行: npm i browserslist caniuse-lite

【webpack】PostCSS 插件 autoprefixer 自动补齐 CSS3 前缀

CSS3 的属性为什么需要前缀 浏览器的标准没有完全统一  举个栗子: .box { display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex } PostCSS 插件 autoprefixer 自动补齐 CSS3 前缀 1、使用 autoprefixer 插件 安装依赖npm i postcss-load

browserslist 目标浏览器配置表

为什么需要: 根据提供的目标浏览器的环境来,智能添加css前缀,js的polyfill垫片,来兼容旧版本浏览器,而不是一股脑的添加。避免不必要的兼容代码,以提高代码的编译质量。 共享使用browserslist的组件们: 组件名功能 Autoprefixer postcss添加css前缀组件 bable-preset-env 编译

Vue CLI 浏览器兼容性

浏览器兼容性 关于浏览器的兼容我们可以从下面一些内容来了解与认识: Vue CLI 3初始化的项目,你会发现有 package.json 文件里的 browserslist 字段 (或一个单独的 .browserslistrc 文件),指定了项目的目标浏览器的范围。这个值会被 @babel/preset-env 和 Autoprefixer 用来确定

对css 的处理

  提取css 下载插件,MiniCssExtractPlugin 改成     对CSS 兼容处理,很方便的解决兼容问题 下载 postcss-loader postcss-preset-env postcss-preset-env的作用:  帮postcss 找到 package.json 中的 browserslist 里的配置,按配置加载指定兼容样式   再看看package.json的配置,

flex布局兼容IE10

vue项目中: 1.把flex和它的各种属性加上浏览器前缀,以后有空的时候把代码在贴上来 2. 写flex的元素标签的儿子元素必须是块状元素 //当时写了这样的样式,不好使 .flex > * { display: block; } // 索性自己在文件中把行内元素改成div 就好使了 3.在文件package.json中的"br

package.json之browserslist

在我们用vue脚手架搭建的项目中,我们可以看到package.json中有一个字段 "browserslist": [ "> 1%", "last 2 versions", "not dead" ] 那么什么是browserslist?它的作用是什么?这就是本文即将叙述的,如有不对的地方,请斧正。 browserlist browserlist是一个前端项目配

日常维护 laravel旧项目的前端踩坑

今天出了个bug,明明一样的代码,旧项目不兼容. 开始以为是版本问题,重新npm update 了一下,没用.于是就重新装node_modules,祸事来了   npm WARN deprecated browserslist@1.7.7: Browserslist 2 could fail on reading Browserslist >3.0 config used in other tools.    命

vue打包后,轮播图的动画内容位置显示不正确,且动画失效

解决方法: 1.在vue项目中找到build文件夹下的vue-loader.conf.js,将extract:isProduction  改为extract:false 此步骤打包后解决了动画图片位置错误的问题   2.package.json配置文件里面对浏览器的版本做了css的前缀处理 此步骤解决了动画失效问题 "browserslist": [ "> 1%",

vue webpack 脚手架项目详细解析系列(二,项目依赖说明 package.json)

继续上一篇, 上一篇讲了 vue 的webpack脚手架的项目结构。那接下来我们看一下他的package.json 文件,看一下。他都用到了那些依赖。 "dependencies": { "vue": "^2.5.2", "vue-router": "^3.0.1" }, "devDependencies": { "autoprefixer":