2024年11月5日火曜日
【JavaScript】画面の座標に関するものCSSだけで吹き出しをつくる
2023年1月22日日曜日
【WEBサイト】Chromeのブラウザキャッシュ
モジュール更新して、WEBサイトみたら、jsファイルが古いものを使っていることがありました。
以下のサイトにかいてありますが、よくある問題なのですが、困ったものです。
https://www.magical-remix.co.jp/magicalog/archives/3020
「更新したはずのサイトがお客さんのパソコンブラウザからは更新されてない…ということはよくある話です。そのたび、「キャッシュが原因ですのでキャッシュをクリアしてください。」と言ってきました。
大体最近は「原因はキャッシュです。Ctrl+F5してください。」と言ってます。。。」
原因はキャッシュファイルを見ているので、その対策検討するのにChromeのキャッシュファイルについて調べてみました。
①キャッシュファイルの場所
以下のサイトみるとキャッシュファイルの場所が記載されています。
実際みると暗号化されているようで中身は正しくみれませんでした。
https://www.tipsfound.com/chrome/01001
場所→C:\Users\%USERNAME%\AppData\Local\Google\Chrome\User Data\Default\Cache
②キャッシュファイルの場所
ブラウザのキャッシュ無効化
→ChromeであればデベロッパーツールのNetworkタブにある「Disable cache」にチェックを付けることでキャッシュを無効にすることができます。
https://magazine.techacademy.jp/magazine/39352
後はIISの設定か、HTMLにタグ追加とか行う方法もあるようです
他のブラウザは以下サイト参考にするといけそうです。
https://blanche-toile.com/tools/webdev-browser-cache
2022年4月5日火曜日
【JavaScript】非同期処理のPromise.allメソッドの使い方
https://techacademy.jp/magazine/36443
・PromiseとはJavaScriptで非同期処理を記述するための仕組
・Promiseはresolveとrejectの2つの関数を引数に取り、成功した際にはresolveが、失敗した際にはrejectが実行
Promiseのresolveはthen 、 rejectはcatchに紐付せて、以下のように記述
Promise.all([非同期処理1, 非同期処理2, ...]) .then((result) => { // 全ての非同期処理が成功した }) .catch((result) => { // いづれかの非同期処理が失敗した });
2022年3月1日火曜日
【node】Error: Node Sass does not yet support your current environment
nodeが8.11.3のプロジェクトを使っていて、他プロジェクト(node 14.17.1)作業に切り替えた時に、
また8.11.3のプロジェクトで起動(yarn start)で、表題のエラーがでました。
外プロジェクト使った時に、nodeのバージョンインストール、環境バージョン変更などおこなったので、その影響のように思います。
ネットで調べて試してみました
https://dev.classmethod.jp/articles/node-sass-could-not-find-a-binding/
⇒うまくいかなかった
npm rebuild node-sass
https://akizora.tech/node-sass-version-support-4278
⇒うまくいかなかった
npm install sass-loader@10.0.5 npm install node-sass@5.0.0
npm install sass-loader@10.0.5 npm install node-sass@5.0.0
わたしは、以下の手順でえらーなく起動できました。
$nodist 8.9.4 // 使用するバージョンを指定
$node -v //Node.jsのバージョンを確認
$npm uninstall gulp-sass
$npm install gulp-sass --save-dev
【参考URL】
2022年2月10日木曜日
WebSocket API をテストするためのツール
WebSocket API をテストするための便利なツールがありました。
上記サイトで記載してありますように、wscat
は以下のようにインストールして使用できます。
npm install -g wscat
使い方などは以下サイトに記載してありました。
https://www.npmjs.com/package/wscat
(例)$ wscat -c wss://matsui.co.jp/Push/socket.io/
2021年11月5日金曜日
【JavaScript】入力エリア(Text)でのIME問題
テキスト入力エリアで、数値入力を全角で行うと、おかしな動作(入力した値と異なる)が発生する場合があります。
その場合は、 「compositionend イベント」を使うとうまく行くかもしれません
【参考URL】
https://developer.mozilla.org/ja/docs/Web/API/Element/compositionend_event
2021年10月20日水曜日
【node】The engine "node" is incompatible with this module. Expected version ">=10". Got "8.11.3"
yarn installを行うと「The engine "node" is incompatible with this module. Expected version ">=10". Got "8.11.3"」のエラーがでて困ってました。
調べてみると、
yarn install --ignore-engines
で行うとうまく行きました。
【参考URL】
https://juejin.cn/post/6844903785710485518
【node】 Sorry, there's a problem with nodist. Couldn't resolve version spec %s: %s 14.17.1 Couldn't find any matching version
上記エラーでの対応方法を調べてみました。
(1) nodistでバージョン確認
14.17.1がない場合は(2)でnodeインストール
(2) nodist + 14.17.1
node -v で14.17.1であることを確認
(3) nodist npm match
npm -v でバージョンを確認
【参考URL】
https://qiita.com/rnnrn/items/c36b57d20aa374a0e46f
Sorry, there's a problem with nodist. Couldn't resolve npm version spec match : Couldn't find any matching version
上記メッセージの場合は、下記サイトに記載している「nodist npm match」でnpmインストールで解決できました。
https://teratail.com/questions/349087
module not found can't resolve
エラー内容的には、ディレクトリがないというエラーなので、importで指定したディレクトリを確認する(誤字)
https://teratail.com/questions/288380
2021年7月5日月曜日
YMALファイルが404エラーで表示できない
サイトを構築したところ、yamlファイルで404エラーになりました。
色々調べたところ、IISの設定が原因でした。
(原因は、「原因は、IISのMIMEにダウンロードできないファイルの拡張子が登録されていないからです。」)
以下、対応方法です。
(1)サーバマネージャを開き、[ツール]-[インターネットインフォメーションマネージャ]をクリックします。
(2)設定するWebサイトを選択して、右ペインより「MIMEの種類」をクリックします。
(3)右端の「機能を開く」「追加」ボタンをクリックします。
(4)以下のように設定し、「OK」ボタンをクリックします。
ファイル名の拡張子:ダウンロードするファイルの拡張子(今回は、.yaml)
MIMEの種類:application/octet-stream
これで開くようになります。
【参考URL】