每天掌握一个“无用”的小知识

一个命令执行多个脚本

前情提要：有个项目本地运行执行npm run dev即可，后续我添加了一个node脚本需要同时执行node run，每次都要开两个运行环境被吐槽啦😅，于是我去调整了一下，将两个合并成一个命令执行

调整package.json脚本里面，通过&符号，来同时并行执行两条任务

{
    "scripts": {
        "dev": "egg-bin dev --port=xxx & node run"
     }
}

以上面的那个为例如果只有内容"dev": "egg-bin dev --port=xxx"则此时只会在本地运行egg。

命令	说明
&&	顺序执行多条命令，当碰到执行出错的命令后将不执行后面的命令
&	并行执行多条命令
||	顺序执行多条命令，当碰到执行正确的命令后将不执行后面的命令
|	管道符

参考：一个命令执行多个npm任务

addEventListener()API支持once

仅第一次点击才执行事件：once，更多介绍 👉 addEventListener options once

document.addEventListener('click', function() {
  console.log('first')
}, {once: true})
document.addEventListener('click', function() {
  console.log('click')
},)

代码执行如下所示👇

ol标签 支持start和reversed属性

有序列表，可以通过start属性，设置从某个数字开始计数（默认正序）。reversed会将列表倒计数。

<ol start="2">
  <li>Shinea, you are best!</li>
  <li>Shinea, you are so kind!</li>
  <li>Shinea, you are so nice!</li>
  <li>Shinea, you are so great!</li>
</ol>

<ol start="2" reversed>
  <li>Shinea, you are best!</li>
  <li>Shinea, you are so kind!</li>
  <li>Shinea, you are so nice!</li>
  <li>Shinea, you are so great!</li>
</ol>

PS：还可以通过设置value属性，对列表指定计数

<ol>
  <li value='22'>Shinea, you are best!</li>
  <li value='33'>Shinea, you are so kind!</li>
  <li value='55'>Shinea, you are so nice!</li>
  <li value='-33'>Shinea, you are so great!</li>
</ol>

css判断横屏

orientation - portrait 竖屏幕 orientation - landscape 横屏幕

@media (orientation: landscape) {
  // viewport 横屏幕
  body {
    flex-direction: row;
  }
}

more 点击跳转到mdn