requirejs HTML結構

Question

我知道我們可以使用requirejs將文件合併到一個js文件中。 類似於以下配置。

module.exports = { 
     baseUrl: 'js/', 
     mainConfigFile: 'src/js/common.js', 
     dir: 'scripts/', 
     optimize: 'uglify2', 
     modules: [ 
     { 
      name: 'common', 
      include: [ 
       'jquery', 

      ] 
     } 

     ] 
    }; 

我的結果到一個文件是

common.js 
---------------- 
jquery.js 
modernizr.js 
common.js 

我的問題是，我們是否還需要把require.js文件scripts文件夾，並使用以下格式

<script data-main="scripts/common" src="scripts/require.js"></script> 

或我們可以使用

<script src="scripts/common.js"></script> 

當文件被壓縮成一個文件？

Answer 1

您仍然需要加載require.js實際使用它提供的模塊加載優勢的常用方法，尤其是在您使用異步功能的情況下。但是，你可以看看almond提供您的代碼使用AMD和（from the README）：

• 優化所有模塊合併成一個文件 - 沒有動態代碼加載。
• 所有模塊在其define（）調用中都有ID和依賴數組--DemandJS優化器將爲您處理此問題。
• 只有一個 requirejs.config（）或require.config（）調用。
• 請勿使用RequireJS multiversion support/contexts。
• 請勿使用require.toUrl（）或require.nameToUrl（）。
• 請勿使用packages/packagePaths config。如果您需要 使用具有主屬性的軟件包，則 volo可以創建適配器模塊，因此 可以在沒有此配置的情況下工作。使用amdify add命令 將依賴項添加到您的項目中。

杏仁是偉大的，因爲它不需要require.js可言;它用自己封裝了自己的代碼，這是一個非常小的AMD加載程序框架，遠不如主庫那麼強大。然後你可以直接在你的HTML鏈接一個優化的文件：

<script src="scripts/common.js"></script> 

的Gruntfile配置爲almond可能是這個樣子：

compile: { 
    options: { 
     name: 'path/to/almond', 
     baseUrl: 'js', 
     include: ['main'], 
     insertRequire: ['main'], 
     mainConfigFile: 'scripts/config.js', 
     out: 'scripts/main.js', 
     optimizeAllPluginResources: true, 
     wrap: true 
    } 
} 

以上是所有標準r.js樣板，你可以在almond主頁找到更多的例子。