vue-cli项目中.postcssrc.js

module.exports = {"plugins": {"postcss-import": {},      //用于@import导入css文件"postcss-url": {},           //路径引入css文件或node_modules文件"postcss-aspect-ratio-mini": {},   //用来处理元素容器宽高比"postcss-write-svg": { utf8: false },    //用来处理移动端1px的解决方案。该插件主要使用的是border-image和background来做1px的相关处理。"postcss-cssnext": {},  //该插件可以让我们使用CSS未来的特性,其会对这些特性做相关的兼容性处理。"postcss-px-to-viewport": {    //把px单位转换为vw、vh、vmin或者vmax这样的视窗单位,也是vw适配方案的核心插件之一。viewportWidth: 750,    //视窗的宽度viewportHeight: 1334,   //视窗的高度unitPrecision: 3,    //将px转化为视窗单位值的小数位数viewportUnit: 'vw',    //指定要转换成的视窗单位值selectorBlackList: ['.ignore', '.hairlines'],    //指定不转换视窗单位值得类,可以自定义,可以无限添加minPixelValue: 1,    //小于等于1px不转换为视窗单位mediaQuery: false   //允许在媒体查询中使用px},"postcss-viewport-units":{}, //给vw、vh、vmin和vmax做适配的操作,这是实现vw布局必不可少的一个插件"cssnano": {    //主要用来压缩和清理CSS代码。在Webpack中,cssnano和css-loader捆绑在一起,所以不需要自己加载它。preset: "advanced",   //重复调用autoprefixer: false,    //cssnext和cssnano都具有autoprefixer,事实上只需要一个,所以把默认的autoprefixer删除掉,然后把cssnano中的autoprefixer设置为false。"postcss-zindex": false   //只要启用了这个插件,z-index的值就会重置为1}}
}

.postcssrc.js文件里边的各个文件对应的含义;

注意:(vue中的几个文件的理解)

1、.postcssrc.js

众所周知为兼容所有浏览器,有的CSS属性需要对不同的浏览器加上前缀,然而有时添加一条属性,需要添加3~4条类似的 属性只是为了满足浏览器的兼容,这不仅会增加许多的工作量,还会使得你的思路被打断。 如何解决这个问题? 处理CSS前 缀问题的神器——AutoPrefixer。

Autoprefixer是一个后处理程序,你可以同Sass,Stylus或LESS等预处理器共通使用。它适用于普通的CSS,而你无需关心要 为哪些浏览器加前缀,只需全新关注于实现,并使用W3C最新的规范。

2、.eslintrc.js

eslint是用来管理和检测js代码风格的工具,可以和编辑器搭配使用,如vscode的eslint插件 当有不符合配置文件内容的代码出现就会报错或者警告

3、.babelrc

这个文件是用来设置转码的规则和插件的

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/249880.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

本地存储cookie和localStorage区别特点

一、cookie cookie算是比较早的技术,最初是为了记录http的状态,提高访问速度。cookie是服务器"种植"在客户端的key-value形式文本文件。但同时客户端也能操作cookie。特点: 大小:cookie的大小限制在4k。每个域名下cooki…

VUE 中 使用 iview Form组件 enter键防止页面刷新

<Form :label-width"100" inline label-positionleft keydown.native.enter.prevent "()>{}">或者使用官方的 submit.native.prevent转载于:https://www.cnblogs.com/smzd/p/9197915.html

mybatis中#和$区别

在Mybtis中的Mapper映射文件中&#xff0c;sql语句传参有两种方式#{}和${} 一般来说&#xff0c;我们通常使用的是#{}&#xff0c;这里采用的是预编译机制&#xff0c;防止SQL注入&#xff0c;将#{}中的参数转义成字符串&#xff0c;例如&#xff1a; 执行SQL&#xff1a;Selec…

mysql 字段存储多个值 ,判断一个值是否在其中

表C_file,其中有个字段是spile&#xff0c;他存的是字符形式&#xff0c;例如&#xff1a; id spile 1 2,10,11 2 2,3,20,22 3 1,6,8 4 5,6,1,9 select * from C_file where spile LIKE %1% 如果这样查询的话&#xff0c;会查询出ID为1、3、4&#xff0c;但正确的应该是3、…

touchWX 自定义组件以及传值

创建如图文件 index.wxc: <template><view class"wx-test" bindtap"handleTap">{{ msg }}{{dataIndex}}</view> </template> <script>export default {properties: {dataIndex: {type: String,value: default value,}},data…

vue 初始框架

VueJs讲解初始框架 一、启动项目 第一步&#xff1a;cmd进入项目文件里&#xff0c;运行npm run dev 启动项目 这里说明启动端口号是8080 第二步&#xff1a;往页面输入&#xff1a;localhost:8080 二、解析渲染步骤 先看整体框架样式和index.html&#xff1a; 从上面我…

Codeforces 914D - Bash and a Tough Math Puzzle 线段树,区间GCD

题意: 两个操作, 单点修改 询问一段区间是否能在至多一次修改后,使得区间$GCD$等于$X$ 题解: 正确思路; 线段树维护区间$GCD$,查询$GCD$的时候记录一共访问了多少个$GCD$不被X整除的区间即可,大于一个就NO 要注意的是,如果真的数完一整个区间,肯定会超时,因此用一个外部变量存储…

Country Road Aizu - 2104

题目链接&#xff1a; https://vjudge.net/problem/Aizu-2104 题解&#xff1a; 咋说啊&#xff0c;一言难尽&#xff0c;花了半小时写出来的&#xff0c;卡了十分钟才恍然大明白是排序。 具体就是让每个村子都通上电&#xff0c;变压器在的村子&#xff0c;与变压器连线点线长…

touchWX使用 echarts

<button bindtap"init" wx:if"{{!isLoaded}}">加载图表</button><button bindtap"dispose" wx:if"{{isLoaded && !isDisposed}}">释放图表</button><ec-canvas het"200" classmy_echart…

vue init webpack vue-demo01复杂安装的详解

终端cmd,在项目中输入下面命令&#xff1a; E:\Vue>vue init webpack vuedemo02 接着就会让你输入或者选择一些是不是要的东西 ? Project name vuedemo02(项目名称) ? Project description A Vue.js project(描述&#xff0c;我默认了) ? Author simalinjia(作者名称) ?…

JAVA EE 基本了解

1、 为什么需要JavaEE 我们编写的JSP代码中&#xff0c;由于大量的显示代码和业务逻辑混淆在一起&#xff0c;彼此嵌套&#xff0c;不利于程序的维护和扩展。当业务需求发生变化的时候&#xff0c;对于程序员和美工都是一个很重的负担。 为了程序的易维护性和可扩展性&#xf…

vue-cli中config目录下的index.js文件详解

// see http://vuejs-templates.github.io/webpack for documentation. // path是node.js的路径模块&#xff0c;用来处理路径统一的问题 var path require(path)module.exports { // 下面是build也就是生产编译环境下的一些配置build: { // 导入prod.env.js配置文件&#xf…

Business Intelligence——SSIS项目从创建到部署的简单总结(二)

在上一篇博客中&#xff0c;我们成功的把包导进了SQL Server中&#xff0c;那么接下来我们就为其创建作业&#xff0c;使数据库能够自动执行我们的任务。首先&#xff0c;我们需要启动“SQL Server 代理”。如图1&#xff1a;图1在“SQL Server 代理”的子节点中&#xff0c;选…

我的vscode配置 利用Settings Sync一键安装

{"prettier.eslintIntegration": true, // 点击保存时&#xff0c;根据 eslint 规则自定修复&#xff0c;同时集成 prettier 到 eslint 中"prettier.semi": false, //去掉代码结尾的分号"prettier.singleQuote": true, //使用带引号替代双引号&q…

IdentityServer4【QuickStart】之使用asp.net core Identity

使用asp.net core Identity IdentityServer灵活的设计中有一部分是可以将你的用户和他们的数据保存到数据库中的。如果你以一个新的用户数据库开始&#xff0c;那么&#xff0c;asp.net core Identity是一个选择。这个示例演示了如何在IdentityServer中使用asp.net core Ientit…

vue demo1

1.开发工具 试过sublime&#xff0c;现在转战vscode&#xff0c;觉得很顺手&#xff0c;总之啥工具习惯就好。 vscode用着不错的插件&#xff0c;推荐安装。 2.项目目录介绍 vue-cli生成的项目目录有点多&#xff0c;初看有点懵&#xff0c;梳理一下会好很多。 ├── ind…

mysql日志介绍

1. 错误日志 错误日志记录的事件&#xff1a; a. 服务器启动关闭过程中的信息 b. 服务器运行过程中的错误信息 c. 事件调试器运行一个事件时间生的信息 d. 在从服务器上启动从服务器进程时产生的信息 2. 查询日志 查询日志记录查询语句与启动时间&#xff0c;建议不是在调试环境…

Mac OS X终端的常用操作命令(UNIX指令)

用了十多年windows&#xff0c;终于换了个高配Mac,俗话说 无论前端还是后端最终还是走向了linux&#xff0c;无论是换了多少台PC最终都会走向Mac。不学习命令行用什么Mac? 干就完了~ pwd 显示现在的文件路径 &#xff08;print working directory&#xff09; ls 显示…

索引( index )

索引在庞大的数据库上最能体现出作用&#xff0c;所谓索引就是根据需求将指定的列提取出来做索引表&#xff0c;可以显著提高在查找数据方面的速度。 在索引的前提下还可以指定索引值是否唯一&#xff0c;索引值是单列或是多列索引。 根据索引类型&#xff0c;索引分为&#xf…

dependencies 和 devDependencies 区别

当我们项目需要下载一个模块的时候&#xff0c;我们安装npm包&#xff08;在项目目录下面npm install module_name&#xff09;的时候&#xff0c;很多时候我们会在后面加上–save-dev 或 –save。这两个参数代表什么呢&#xff1f; 初识 相信很多人都会回答&#xff1a; np…