野球リーグスコア管理システムの開発

2019-01-13に作成

image
野球リーグスコア管理システムキャップ野球情報局に関する進捗です。

使っている技術など

  • NodeJS
  • ReactJS
  • netlify
  • MySQL
  • materializecss
  • react-bootstrap
  • react-bootstrap-table-next

旧システムについてはこちらの記事をご覧ください。

残りタスクリスト

trello

所有者限定モードのためこのボードには投稿できません ボードとは?

react-planetがsafari12系で動かない問題

react-planet

concept.png
手軽に円形メニュー(Circular Menu)を提供できるライブラリ。

ResizeObserver is not defined

react-planetではリサイズイベントをResizeObseverによって検知しています。

ただし、ResizeObserverはsafari 13.1以降に対応しています。
手元にあるiPhone5Sはsafari12系でした。

react-planet
use-resize-observer
  ┗ resize-observer-polyfill

今回、おそらく動いていないのはresize-observer-polyfillのようです。
きちんとメンテされてそうなのはこれ。
resize-observer

ただ、use-resize-observerのソースを書き換えて、
react-planetのdependencyも変えないといけないので一旦調査してエラー回避する方向で終了。

TopMenuコンポーネントの中でreact-planetを使っています。


{typeof ResizeObserver !== 'undefined' ? <div id="topMenu"> <TopMenu/> </div> :<></> }

CIを設定していないのにNetlifyのビルドが通らなくなった!

Treating warnings as errors because of process.env.CI = true

2020/6/15にNetlifyの仕様が変わったのが原因でソースの警告があるとビルドが通らなくなる現象が発生している模様。

解決方法

(元のビルドコマンドがnpm run buildの場合)
Build Commandを「CI = npm run build」に変更する。

その他コンフィグの設定方法が変わってきているようなのでリリースなどがある場合は要注意かも。