私のアプリをrequire.jsを使用するように変換中ですが、ブートストラップをロードできないようです。これは、(以下はなしサブディレクトリで、シンプルなフラットなディレクトリ構造を前提として)私がやっているの輪郭である:RequireJS - ブートストラップを読み込めません
main.js
requirejs.config({
paths: {
"jquery": "jquery-1.12.4.min",
"bootstrap" : "bootstrap.min"
},
shim: {
"bootstrap": {
deps: ["jquery"]
}
}
});
require(["jquery"], function($) {
console.log($.fn);
});
index.htmlを
<html>
<head>
<title>RequireJS Test</title>
<link rel="stylesheet" type="text/css" href="./bootstrap.min.css">
</head>
<body>
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<ul class="nav navbar-nav">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">File</a>
<ul class="dropdown-menu">
<li><a href="#">Open...</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Save</a></li>
<li><a href="#">Save As...</a></li>
</ul>
</li>
</ul>
</div>
</body>
<script data-main="./main" src="./require.js"></script>
</html>
私のブートストラップのnavbarのドロップダウンは機能しません。コンソールのjQueryオブジェクト自体を調べると、bootstrap.min.jsには何も付いていません。しかし、私は何が間違っているのか分かりません。私の本当のアプリもバックボーンを使い、問題なくロードされます。そのために私は次のシムを使用します:
'backbone': {
'deps': ['jquery', 'underscore'],
'exports': 'Backbone'
}
しかし、ブートストラップのシムは私のために働いていません。私は明白な何かを欠いていますか
私はrequirejs、bootstrap、およびjQueryの最新バージョンを使用しています。
ありがとうございました。本当にそれは私を混乱させるものでした。私は 'requirejs.config'はスクリプトタグの束のようにすべてをロードするという印象を受けました。しかし、これはAMDの「非同期」ビットなのでしょうか? – ChrisM
'requirejs.config()'は*トップレベル*で 'deps'オプションを使ってロードするモジュールのリストを提供しない限り、何もロードしません。 (これは設定のトップレベルにあり、個々の 'shim'値の' deps'と同じではありません)。トップレベル 'deps'は' require(< 'require.config'コールの直後に' deps>の値 ')を返します。 – Louis
入手しました。説明をありがとうございます。 – ChrisM