Collection

[yizihan]

动态传参更改类名（定义类名函数）

// IndexComponent
<st-row justify="between"></st-row>

// RowComponent
<div :class="['flex-justify-${this.justify}']"></div>
export default {
    props: {
        justify: {
            // params: 'start', 'end', 'center', 'between'
            default: 'start'
        }
    }
}
// class类调用flex-justify函数
.flex-justify-between {
    .flex-justify(@justify:space-between)
}
// 定义flex-justify函数 @justify参数  when()条件
.flex-justify(@justify) when(@justify = space-between) {
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-box-pack: justify;
}

---

Express “its MIME type ('text/html') is not a supported stylesheet MIME type”

Express服务访问‘style.css’文件时报错：

Refused to apply style from 'http://localhost:3000/css/style.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

解决方案
通过Express内置的express.static托管静态文件，

<link rel="stylesheet" href="/css/style.css">

// 将静态资源文件所在目录作为参数传递给express.static中间件，就可以提供静态资源文件的访问了。
app.use(express.static(__dirname + '/public'));

---

Browsersync-省时的浏览器同步测试工具

链接

---

在线制作雪碧图生成代码

链接

---

在线正则表达式验证

链接