タグ JavaScriptファイル
新着順 10 users 50 users 100 users 500 users 1000 users超簡単にChromeの拡張機能を作ってみる【誰でもできるよ】 - Qiita
はじめに みなさんはChromeのか拡張機能を使っていますか? 僕も使っていますが、案外Chromeの拡張機能を作るのは簡単です。 今回は、普段の業務の効率を上げるのも兼ねて自作してみました! 最低限準備するもの manifestファイル Javascriptファイル ぶっちゃけ、これだけで動きます。 実際に作ってみよう それでは実際... 続きを読む
100秒で理解するESM(ESModules)
ESMとは まず、ESMの定義から見てみましょう。 JavaScript Primer には、以下のように書かれていました。 ECMAScriptモジュールは、ES2015で導入されたJavaScriptファイルをモジュール化する言語標準の機能です。 jsprimer - [ES2015] ECMAScriptモジュール この定義を見て、「2015年から?」「それまではどうしてたの?... 続きを読む
Deep Dive: Node.jsのESMデフォルト化への道
Node.js 21では --experimental-default-type=module フラグで、JavaScriptファイルのデフォルトの解釈をCJS(CommonJS)からESM(ECMAScript Modules)に変更できるようになっています。 Node.js 21 is now available! | Node.js これは、Node.jsにおいてJavaScriptファイル(.js)のデフォルトをESMに変更するための第一歩で... 続きを読む
Rails 7 で React & TypeScript を導入する方法(tsx, esbuild, jsbundling-rails) - LEFログ:学習記録ノート
※この記事では「新しくRails 7 アプリを作成するときのこと」を想定していますが、Rails 6を7に上げるときにもそれなりに役立つ情報だと思います! 結論 rails newのときにesbuildを指定してあげれば、あとはJavaScriptファイルや.jsxファイルを、.tsxにしてあげるだけでOK。 型チェックや構文チェックを導入するには少... 続きを読む
もうTypeScriptの補助輪を外そう 明日は//@ts-checkを使う
VIMで書いている人はいないから、そろそろTypeScript(三輪車の補助輪)を外していこうという話。 Visual Studio Code は下のリンクからインストールできる。これが前提。 TypeScriptを活用したJSプロジェクト JavaScriptファイルにおける //@ts-check を使用してほしい。 JSDocを使ってJSで型ヒントを提供する .jsファ... 続きを読む
Deno v1.15で導入されたNode.js互換モードについて
はじめに 2021/10/12にDeno v1.15がリリースされました。 この記事では、Deno v1.15で新しく導入されたNode.jsの互換モードについて解説します。 Node.jsの互換モードとは? まず、以下のようなJavaScriptファイルがあったとします。 import { EventEmitter } from "events"; const emitter = new EventEmitter(); emitt... 続きを読む
2020年でJavaScript学ぶならきっとブラウザ向けJSガン無視していきなり初手node.jsがいいんじゃないかというメモ - min.t (ミント)
tricken@WPサイト設置した @tricken node.js が何者なのかようやくわかったわ……フロントエンド側のJavaScriptじゃなくて、PythonやPHPと同じように書いてはバイナリ実行&サーバサイド実行できるタイプのJavaScriptってことか……Python3.8 と同じ感じでJavaScriptファイルが扱えることがわかって驚いている。 2020-11-11 ... 続きを読む
開発ツールWebpackの公式サイト、警察官による黒人殺害事件への抗議でドキュメントを一時閲覧できなくする | スラド オープンソース
WebサイトやWebアプリケーションで使われるJavaScriptファイルなどの各種アセットを変換・結合するオープンソースソフトウェアであるWebpackの公式ドキュメントサイトに、米国で発生した警察官による黒人殺害事件への抗議として一時的に抗議文が掲載されていたのだが、これによってWebpackのドキュメントが閲覧できなく... 続きを読む
GutenbergのブロックスタイルをPHPで簡単に追加する – エビスコム
『グーテンベルク時代のWordPressノート テーマの作り方 2(ランディングページ&ワンカラムサイト編)』ではJavaScriptファイルを用意してブロックスタイルを追加する方法を紹介しましたが、最新のGutenberg(バージョン6.2)ではPHPだけでも簡単に追加できるようになりました。 たとえば、functions.phpに次のように r... 続きを読む
漫画村「星のロミ」の難読化されたJavaScriptファイルを解読してみる
※ただ好奇心で調べてみようって思っただけなので、なんか凄いモノが発見できたとかそういうのではないよ! 前回、復活した漫画村のWebSocket通信を覗き見るという内容の記事を書きました。 JavaScript関連も興味があったのでちょっと覗いてみることにしました。 一度にすべて解読するのは難しいので、この記事は随時書き... 続きを読む
面倒なJavaScriptコードのとりまとめがこれ1つで可能に、「webpack」入門 | さくらのナレッジ
最近JavaScript関連の開発で採用が進んでいる「webpack」は、JavaScriptファイルの変換や結合といった操作をコマンド1つで実行できるツールだ。本記事では、webpackとは何かという基本的な概念から導入方法、実際の利用例などを紹介する。 モジュール管理機構の不足や未サポート機能の問題をツールで解決する「webpack」... 続きを読む
webpack@4 で出力するファイルをリビジョン管理する - 30歳からのプログラミング
ここでいうリビジョン管理とは、JavaScriptファイルやスタイルシートのファイル名に、ハッシュ値などのユニークな値(リビジョン)を付与すること。 そうすることで、ブラウザが古いファイルのキャッシュを利用してしまい変更が反映されない、という事態を回避できる。 手動でファイル名を更新することも可能ではあるが... 続きを読む
「TweetDeck」をスマホ向けにカスタマイズする猛者現る - ITmedia NEWS
Twitterが公開しているPC向けのWebクライアント「TweetDeck」を、Androidスマートフォン上で見やすく表示できるように改造した猛者が現れた。 アプリ名は「TJDeck」で、作成者は@totorajさん。アプリの内蔵Webブラウザ(WebView)でTweetDeckを開き、独自のJavaScriptファイルを読み込ませることで、TweetDeckのカラムな... 続きを読む
最新版で学ぶwebpack 4入門 - スタイルシート(CSSやSass)を取り込む方法 - ICS MEDIA
ウェブのフロントエンドエンジニア開発で人気を集めるモジュールバンドラーのwebpack(ウェブパック)。webpackにはJavaScriptファイルのバンドルだけではなく、スタイルシート(CSSやSass)のバンドルもできます。ICS MEDIAの記事「 最新版で学ぶwebpack 4入門 」では、webpackの基本的な使い方を解説しましたが、この記事ではスタイルシートに焦点をあてて解説します... 続きを読む
マイクロソフト、「TypeScript 2.3」をリリース。コメント付きJavaScriptをTypeScriptで型チェック可能に - Publickey
マイクロソフト、「TypeScript 2.3」をリリース。コメント付きJavaScriptをTypeScriptで型チェック可能に マイクロソフトは「TypeScript 2.3」のリリースを 発表しました 。 TypeScript 2.3では、JavaScriptファイルにコメントを記述することでTypeScriptによる型チェックなどを行える機能が追加されました。これにより、明示的にType... 続きを読む
Gmail、JavaScriptファイル添付禁止へ、セキュリティ上の理由で2月13日より -INTERNET Watch
Googleは、メールサービス「Gmail」において2月13日より、メールにJavaScriptファイル(.js)を添付でいないようにする。従来より添付を制限している「.exe」「.msc」「.bat」などの形式のファイルと同じく、セキュリティ上の理由によるもの。 該当する形式のファイルを添付しようとするとブロックされ、その理由を説明するヘルプページへのリンクを表示。「実行ファイルや特定のリンク... 続きを読む
Gmail、JavaScriptファイルの添付を禁止へ(2月13日から) - ITmedia ニュース
Googleが、セキュリティ上の理由からGmailへの添付を禁じているファイルに、JavaScriptコード(.js)を追加する。2月13日から.jsファイルを添付しようとすると、警告が表示されるようになる。 米Googleは1月25日(現地時間)、Gmailへの拡張子が「.js」のファイルの添付を2月13日から禁止すると発表した。セキュリティ上の理由からだ。 同社は既に、拡張子が「.exe」「.... 続きを読む
GmailでのJavaScriptファイルの添付が不可に、2月13日からスタート - GIGAZINE
Googleで各種アプリケーションを開発する「G Suite」チームは2017年1月25日、Gmailに添付できる添付ファイルからJavaScriptファイルを除外する方針を発表しました。この施策は2017年2月13日から適応されます。 G Suite Update Alerts: Gmail will block .js file attachments starting February 13... 続きを読む
2015-10-25のJS: ESLint入門、ECMAScriptとは何か?、rollupとES6 modules - JSer.info
JSer.info #250 - ESLint v1.7.0がリリースされました。 .eslintrc内に"extends": "./foo.js"と書くことでJavaScriptファイルを継承出来るようになっています。 また、JavaScript - ESLint 最初の一歩 - Qiitaという記事では、ESLintの使い方、設定方法、エディタ、ES6関連のルールについてなどが紹介されています... 続きを読む
gulpとかwatchifyとかbrowserify-shimとかの話
今では、JavaScriptを書いててrequire()やimportを使わないことはありえない。そしてクライアントサイドではそのためにbrowserifyやwebpackを使うことになる。 browserify-shim やみくもにimportしていると、1つのJavaScriptファイルのサイズが大きくなってしまう。また、エントリポイント(実際に<script>で読み込まれるであろう入り口とな... 続きを読む
React + BrowserifyプロジェクトでJS/CSS/HTMLを圧縮(Minify)する - Umi Uyuraのブログ
2015-07-29 React + BrowserifyプロジェクトでJS/CSS/HTMLを圧縮(Minify)する React Browserify Node.js ReactとMaterial UIを組み合わせると、それだけでBrowserifyで結合したJavaScriptファイルが1MB超えてしまうので、やっぱり圧縮とかした方が良いのかな―と思い、やり方を調べてみました。 ※2015/... 続きを読む
Webサイトのアクセシビリティをチェックする為のライブラリ・「tota11y」 - かちびと.net
tota11y tota11yはWebサイトのアクセスビリティチェックを行うライブラリです。基本的にはJavaScriptファイルを読み込むだけ、その他は必要に応じてプラグインファイルを読みこめば自動でチェックし、問題点を教えてくれます。チェック項目は左下にツールが表示されるようになるのでそこから確認するだけ。上図スクショはコントラスト比をチェックしているところです。アクセシビリティの判定はGoo... 続きを読む
[JavaScript] ブラウザでローカルファイルを実行する方法:Firefox、Chrome | Ouka Studio
file://プロトコルのHTMLファイルでJavaScriptファイルを直接実行する方法。 共通の問題 XMLHttpRequestのstatusCodeが「0」になる XMLHttpRequestを使ったAjax通信が成功しても、ステータスコードは「200」にならず、「0」になる。 これは、どのブラウザでも共通。 200しか想定していない外部ライブラリを使う場合に問題になる。Cocos2d-x... 続きを読む
え!?わずか1秒でCSS / JavaScriptファイルを圧縮!Sublime Text3にYUI Compressorを入れてみた。 | the Saibase
え!?わずか1秒でCSS / JavaScriptファイルを圧縮!Sublime Text3にYUI Compressorを入れてみた。 2015年2月15日 ツイート フロントエンジニアのみなさーん!今日もゴリゴリHTMLコーディングしてますかー!? 本当はHTMLよりも、音の波形をずっと眺めていたいTomicciです。こんにちは。 今回は、CSSや、JavaScriptのファイルの圧縮に関して... 続きを読む
GoogleドライブでのJavaScriptファイルのホスティング問題、解決?: point of view point
GoogleドライブでWeb公開したJavaScriptファイルがエラーとなり、読み取れなくなる問題(Googleドライブ上に公開したJavaScriptファイルにアクセスするとProvisional headers are shownって言われる)。ほかに事例がないかと思い探してたら、見つかった。これで解決するかも。 該当する事例はTwitter経由で発見。 Drive Notepad (Goo... 続きを読む