skillup

技術ブログ

JavaScript

requirejsでのモジュール読み込み

投稿日:

JavaScriptのモジュール化では2019年5月現在ではwebpackなどを使うことが一般的かと思いますが、以前はrequire.jsなどというライブラリがあったようです。

例えば下記のようなファイル構成だったとします。

この場合、下記のようなファイルで読み込めます。

require.jsは下記よりDLしましょう。(CDNでもOK)

https://requirejs.org/docs/download.html

sample.html

libs/dateutil.js

*strutil.jsも同一の構成です。

main.js

こんな感じで、複数のJSファイルを読み込めます。

昔、Angularをやった時にこんな構成がありましたね・・

他にも、設定ファイルを使う方法やビルドして一気にmain.jsにファイルを集める方法などあります。

ソースURL

https://github.com/umanari145/library/tree/master/requirejssamp

参考URL

RequireJS使い方メモ

【RequireJS】使い方メモ

-JavaScript
-

執筆者:


comment

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

関連記事

no image

オートコンプリートのプラグイン

最近だとフォームの入力画面で最初の数文字を入力すると候補を予測して表示してくれる機能(=オートコンプリート)があることが一般的ですね。 いろいろなプラグインがありますが、今回お勧めしたいのはBoots …

no image

vueについてのポイントその3(主に親子関係について)

最近またvueにポチポチ触っているので再度復習。 主に値の監視に関して。コードは一切なく主に概念的なものに関して。 コンポーネント間では基本的にダイレクトに値のやり取りができない というかコンポーネン …

no image

ejsのテンプレート

普段生のHTMLを書く機会はほとんどなく、画面側の仕事でもフレームワークを使うことがほとんどなので搭載されているテンプレートを使っています。 で、生のHTML/CSSの本を読んでいてejsなるテンプレ …

no image

JavaScriptのタイマー

えーボタンを押すと、時間の計測がはじまり、別のボタンを押すとそのタイマーがとまるというもの。 WEBのアプリでは比較的よくお目にかかるタイプかと思います。 一番多いのは情報商材のページかもしれないです …

no image

クリック編集のjQuery

最近のWEBサービスだと表示の画面と編集画面が同じになっていて、一見表示なんだけど、クリックすると特定の項目は編集できる、そんな画面がふえていきていますよね。 先日社内アプリをつくっていたところ、そう …

アーカイブ