自適應計算n欄的寬度

網頁想要排版成n欄一排

<div class="grid">
  <div class="grid__item"></div>
</div>
.grid {
  display: flex;
  flex-wrap: wrap;
    &__item {
      margin-bottom: $gutter;
      width: calc((100% - 2 * #{$gutter}) / 3);
      &:not(:nth-child(3n)) {
        margin-right: $gutter;
      }
  }
}
0

windows跑deploy.sh出現 $’\r’: command not found

事情是這樣的,自從到新公司被配了windows電腦,就開啟了我人生很多的體悟,原來有mac用是這麼的幸福,人生真的不要失去了才懂得珍惜欸!今天IT終於幫我開好gitlab倉庫,我就想說來寫一下自動化部屬,先把deploy.sh的部分完成,寫好後在script那邊加了sh deploy.sh,不出我所料windows總是能很有存在感的在各種小事上跟mac不同@@


總之,網路上查了很多說明,因為作業系統編碼不同,有些人說要vim進去看啊、下指令format啊…之類的。但是現在大部分人的電腦都是win10了,直接電腦內建就有可用工具,不用安裝其他套件或是下指令。

步驟 :

  • windows進入設定 –> 更新與安全性 –> 開發人員專用 –> 選擇【開發人員模式】
  • windows搜尋bash會跑出Git Bash程式,用Git Bash跑指令(不要用windowsPowerShell),成功。

0

在vue專案中讀取package.json資料

先在vue.config.js中加入plugin定義

var webpack = require("webpack");
module.exports = {
    configureWebpack: {
        plugins: [
            new webpack.DefinePlugin({
                "process.env": {
                    PACKAGE_JSON: '"' + escape(JSON.stringify(require("./package.json"))) + '"'
                }
            })
        ]
    }
}

讀取

let version = JSON.parse(unescape(process.env.PACKAGE_JSON)).version
0

在vue中使用setTimeout與setInterval

在vue中啟用、清除timeout的寫法不同,如果clearInterval沒有加上window,就不會停止。

setTimeout可以直接使用:

this.timeout = setTimeout(() => {
    console.log('一小時後要做的事');
}, 1000 * 60 * 60);
clearTimeout(this.timeout);
閱讀更多
0

React Native 使用 alias,不用寫很多相對路徑。

在React Native 版本0.61.5 ,使用 npx react-native init 建立的專案,自動會幫你安裝 metro-react-native-babel-preset ,並且產生 babel.config.js 這隻檔案
所以只需額外安裝 babel-plugin-module-resolver

$ yarn add babel-plugin-module-resolver -D
閱讀更多
0

‘React/RCTBridge.h’ file not found

  1. In Xcode, go to the project scheme (Product -> Scheme -> Manage Scheme -> double click your project).
  2. Click on the ‘Build’ option at the left pane.
  3. Uncheck ‘Parallelize Build’ under Build Options.
  4. Then in Targets section, click ‘+’ button then search for ‘React’. Select it and click ‘Add’. ‘React’ should now appear under
  5. Targets section. Click and drag it to the top so that it will be the first item in the list (before your project).
  6. Clean the project and build.
0