使用2个style的方式不够优雅,可以使用下面方式做样式穿透 .normal-field /deep/ .el-form-item { margin-bottom: 0px; } .normal-field /deep/ .el-form-item__label { color: #939393; }

vue之scoped穿透 问题:在页面中,需要了第三方插件的样式,又不想取消scoped,防止造成样式污染 方法:>>> 代码: #tab >>> .ivu-table-stripe-odd td{ background-color: #ecf3fd!important; border-bottom: 0; } tab 为需要穿透的组件id 注意: 在sass等解析器中>>>可能不会被识别,需要使用/deep/代替(/deep/ 为 >>&

1.解决 vue 的缩进问题 配置 eslint , 只要要eslint 对应的值为 0,则 eslint 将不会对其进行检测 (.eslintrc.js  --  rules ) A. 不检测 缩进  -->   'indent': 0 B. 不检测 函数的 space --> 'space-before-function-paren': 0 2. vue 的 sass 调用 mixin 函数 需要添加 @mixin .

可能我的方法很笨,简单实现来的就是给两个状态,一个状态点击时就发生改变,另外一个给一个定时器延迟改变 篮圈部分,给了两种状态,一个isDisable,一个comeTime 点击事件以后comeTime跟随事件直接改变状态,而isDisable则用setTimeout延迟两秒改变,这样就可以阻止连续点击事件触发器以后事件冒泡产生bug 关于vue阻止滚动穿透,相当简单,就在标签内加一串: @touchmove.prevent 精彩

1.创建一个基于 webpack 模板的新项目 $ vue init webpack myvue 1 2.在当前目录下,安装依赖 $ cd myvue $ npm install 1 2 3.安装sass的依赖包 npm install --save-dev sass-loader //sass-loader依赖于node-sass npm install --save-dev node-sass 1 2 3 4.在build文件夹下的webpack.base.conf.js的rules里面添加

sass可以提高我们的开发效率,怎么在vue的项目中使用sass并且可以设置一些公共的文件呢? 使用sass 1.安装sass的依赖包 npm install --save-dev sass-loader //sass-loader依赖于node-sass npm install --save-dev node-sass 2.在build文件夹下的webpack.base.conf.js的rules里面添加配置 module: { rules: [ //...默认及其他 { test: /\.s

先npm两个插件 npm install sass-loader --save-dev npm install node-sass --save-dev 然后在webpack当中配置 { test: /\.vue$/, loader: 'vue-loader', options: { loaders: { 'scss': 'style-loader!css-loader!sass-loader' } } } 最后在vue页面. <style lang="scss" type=&q

一.安装sass依赖包 $ npm install sass-loader --save-dev //sass-loader依赖于node-sass $ npm install node-sass --save-dev 二.修改 style标签添加lang属性 <style lang="scss" type="text/css"> //你的sass语言 $primary-color: #333; h1 { color: $primary-color; /

1.安装node-sass,因为scss是基于此库的 cnpm install --save-dev node-sass 2.安装sass-loader cnpm install --save-dev sass-loader 全部安装完成之后,到webpack.base.conf.js的编译规则里添加scss { test: /\.sass$\, loaders: ['style','css','sass'] } 3.使用声名 <style scoped lang="scss"&

1. 添加less.sass处理 1.1如果是sass,首先在当前目录安装处理插件(sass): npm i -D node-sass sass-loader 1.2如果是less,首先在当前目录安装处理插件(less) npm i -D node-less less-loader 2.其次打开webpack.base.conf.js { test:/\.scss$/, loaders:['style','css','sass'] }, 3.在所需要sass或less处理的文件填写对应的css处

项目中使用sass报错,之前一直使用同样的安装方式 cnpm install sass-loader node-sass -D,正常使用没问题,没想到这次同样的方式却报错了,网上查的原因是sass-loader版本太高了,修改一下版本号再重新下载一次就行了 参考地址如下:解决npm安装node-sass太慢及编译错误问题

项目使用 vue-cli 3 在项目中使用 sass npm install sass-loader --save -D cnpm install sass-loader --save -D       (cnpm 更加好安装) 使用 sass ,需要安装其依赖的模块 node-sass , npm install node-sass --save -D cnpm install node-sass --save -D      (cnpm 更加好安装) 在项目中使用 less npm inst

推荐:https://www.cnblogs.com/Mr--Li/p/7921150.html

npm i sass-loader --save -dev(-D)

ChromeDriver installation failed Error with http(s) request: Error: connect ETIMEDOUT 172.217.160.80 ChromeDriver  被墙了 方法一: npm install chromedriver --chromedriver_cdnurl=http://cdn.npm.taobao.org/dist/chromedriver 方法二: cnpm install chromedriver 方法三:

本篇文章主要是我在开发前研究了webpack+vue.js的单页面应用,因为需要用到node的npm,所以确保安装了node,建议官网安装最新的稳定版本.并且在项目中需要加载一些npm包,由于npm的服务器在国外,可能我们下载的过程会比较慢,所以建议用阿里的镜像cnpm安装,10分钟实时更新一次npm的镜像.具体的下载配置参考阿里的cnpm官网.本文章只是和大家探讨怎么利用webpack配合vue.js做一个单页面应用,具体关于vue里面的内容怎么写并不在本篇文章的介绍范围. 1. 定义我们de

一,  vue.js 2.0 1, cnpm install vue-cli -g 全局安装 2, 运行vue查看安装是否成功(创建vue-cli目录: vue init webpack demo) 3, npm init -y 用来初始化生成一个新的 package.json 文件,它会向用户提问一系列问题,如果你觉得不用修改默认配置,一路回车就可以了. 如果使用了 -f(代表force).-y(代表yes),则跳过提问阶段,直接生成一个新的 package.json 文件 4, 运行项目执行

如何为你的 Vue 项目添加配置 Stylelint 现在已经是 9102 年了,网上许多教程和分享帖都已经过期,照着他们的步骤来会踩一些坑,如 stylelint-processor-html 已经不再维护,以及 --fix 之后 .vue 文件只剩下 <style> 部分等.我在踩完坑跑通出满意的效果后,维护一份新的指引,以备后续项目使用,顺便分享一下. 为什么选择用 stylelint ? 这个问题有两层含义,一是为什么要使用这个样式代码风格检查工具,二是与其他工具相比,为什么选择 st

 一.IDE开发工具 常用的开发工具有webstorm和sublime. 我个人喜好用Atom+插件的形式 打开Atom,在file --> settings --> packages中收入vue开发相关的插件 beautify:代码格式 atom-html-preview:html代码提示 language-vue.language-vue-component:vue语言 lint-sass-vue:vue的sass语言 vue-autocomplete:vue语法提示 文件结构如下: 二.

;(function(win, lib) { var doc = win.document;// win = window,lib = window.lib; var docEl = doc.documentElement; var metaEl = doc.querySelector('meta[name="viewport"]'); var flexibleEl = doc.querySelector('meta[name="flexible"]');//这样的