ラベル JavaScript の投稿を表示しています。 すべての投稿を表示
ラベル JavaScript の投稿を表示しています。 すべての投稿を表示

2024年11月5日火曜日

【JavaScript】画面の座標に関するものCSSだけで吹き出しをつくる

仕事で、吹き出し用の部品を作らなければならなくなったので、実装方法しらべてみました。 以下の参考URLが分かりやすかったので、これを参考にしたら対応できました。
 【参考URL】

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
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】

https://qiita.com/n0bisuke/items/7c683fd70e398ad678b9

2022年2月10日木曜日

WebSocket API をテストするためのツール

WebSocket API をテストするための便利なツールがありました。

https://docs.aws.amazon.com/ja_jp/apigateway/latest/developerguide/apigateway-how-to-call-websocket-api-wscat.html

上記サイトで記載してありますように、wscat は以下のようにインストールして使用できます。

npm install -g wscat

 使い方などは以下サイトに記載してありました。

https://www.npmjs.com/package/wscat

 (例)$ wscat -c wss://matsui.co.jp/Push/socket.io/

  ⇒Connected (press CTRL+C to quit) ⇒接続成功

 

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】

https://itp.blog.ss-blog.jp/2013-05-23