カテゴリー: JavaScript
【JavaScript】Audioオブジェクトを再生停止する
最近、JavaScriptのAudioオブジェクトを使って音楽再生するコードを書いてるんですが、再生と停止を繰り返す中で気付いたことがあります。なんかね、ただ止めただけでは他の曲を再生したときにオブジェクトが重複して作られちゃうことがあるんですよね。なんだろう。
【Vue.js】Vuexで他のモジュールのアクションを呼び出す【メモ】
ストアオブジェクトを複数のモジュールに分けていた場合に、1つのモジュールから他のモジュールのアクションを呼び出した方が効率的ということがあります。それぞれ名前空間が決まってるわけだし、呼び出すことは出来ないんじゃないか……と思ってたんですけど、普通に出来るみたいですね。
Vue.js+Chart.js（vue-chartjs）+Laravelでグラフを作成しました。 【#np2020】
このブログではこれまでFlashを使ったグラフを採用してきたのですが、ブラウザ側のFlashへの対応が厳しくなっている今、Flashじゃないよなあということでリニューアル後はJavaScriptによるグラフを採用することにしました。
【vue-chartjs】グラフのオプションを一括設定したい【#np2020】
Vue.js と Chart.js を連携させてグラフを描画する場合、ラッパーとして「vue-chartjs」を使うと面倒なことがかなり省略できて楽です。ファイルさえ準備しておけばデータを入れて簡単にグラフが描画できるというイメージでしょうか。導入に関しては公式サイトなどを参照してください。
【メモ】npmからyarnに乗り換え【#np2020】
少しずつ開発している新サイト（プロジェクト名：np2020）では、環境の設計以来ずっとnpmを使っていたんですけど、業務でこれまた新しく設計された環境（設計したのは前任者）で開発をしていて、そこでyarnを使っていてインストールがとても速くて使いやすいので、こっちでもそれに乗り換えましょうということで乗り換え。
npmとyarnの違いについてはこの辺がわかりやすいです。
Yarnとnpmの違い：JavaScriptパッケージマネジャーを比較する – WPJ
npm vs yarnどっち使うかの話 – Qiita
手順は以下の通り。
- npmでyarnをインストール
- yarnコマンドを実行
Amazonの検索を簡易に行うツールをLaravel + BootstrapVueで作ってみました【#np2020】
「npm run production」でエラー（メモリ不足）が出てコンパイル出来ない【#np2020】
今現在のフロントエンドはBootstrapVueで、Laravel Mixを使って
npm run devnpm run production【メモ】vue-chartjs を入れて「[Vue warn]: Invalid prop: type check failed for prop “chartData”」が出る場合の対処方法【#np2020】
JavaScript エラー「Uncaught SyntaxError: Unexpected end of input」への対応
記録されたエラーは下記の通り。
"message": "Uncaught SyntaxError: Unexpected end of input",
"file": "",
"lineNo": 1,
"colNo": 158,
"stack": "SyntaxError: Unexpected end of input",
"user_agent": "Mozilla/5.0 (Linux; Android 7.1.1; OPPO A79; Build/N6F26Q; wv) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2490.92 Mobile Safari/537.36 SogouMSE,SogouMobileBrowser/5.6.0"なるほど。 ChromeのJSON.parse()に空文字を入れるとエラーになると。エラーログからでは具体的にどのJavaScriptファイルでエラーが出ているのかわからないし、そもそも1行目のエラーとなっていて問題の特定が難しかったけれど、幸いサイト内で「JSON.parse()」を使っている部分は限られていたので、そこを改修。 もともと発生頻度の低いエラーなのでこれで効果があるかどうかは不明だが、しばらく様子を見たいと思います。 ちなみに僕が見た環境での「JSON.parse()」は、こんな感じで使われていました。analog_MultiMeter: JSON.parseでハマった
原因 ChromeのJSON.parseは、空文字が入るとおかしなことになるらしい。 JSでは空文字列はfalse性を持つので、上記の対策で通るという事。 そのエラー発生は良いとしても、JSON.parse()のエラーでなくてEnd of Inputなんてわかりづらいエラー、それもHTMLの1行目なんかに出るのが悲しい。
function (error) {
var obj_error = JSON.parse(error);
}