將多個Jquery就緒函數合併爲一個就緒函數的Grunt任務

Question

我已經準備好將函數分佈在多個文件中，我希望合併和縮小這些文件。是否有一個將所有準備合併到一個函數的咕task任務？

// file1.js 
$(document).ready(function(){ 
    $(".class1").click(function() { 
     // Some Action 
    }) 
}) 


// file2.js 
$(document).ready(function(){ 
    $(".class3").on("blur", function() { 
     // Some Action 
    }) 
}) 

// file3.js 
$(document).ready(function(){ 
    $(".class2").on("change", function() { 
     // Some Action 
    }) 
}) 

// file4.js 
$(document).ready(function(){ 
    $(".class3").click(function() { 
     // Some Action 
    }) 
}) 

我正在尋找類似...

// file.js 
$(document).ready(function(){ 
    $(".class1").click(function() { 
     // Some Action 
    }) 

    $(".class3").on("blur", function() { 
     // Some Action 
    }) 

    $(".class2").on("change", function() { 
     // Some Action 
    }) 

    $(".class3").click(function() { 
     // Some Action 
    }) 
}) 

不會損害性能，如果我只是運行咕嚕任務中的所有文件相結合，具有多種功能，準備在文件中合併這樣的使用grunt-contrib-uglify？

// file.js 
$(document).ready(function(){ 
    $(".class1").click(function() { 
     // Some Action 
    }) 
}) 

$(document).ready(function(){ 
    $(".class3").on("blur", function() { 
     // Some Action 
    }) 
}) 

$(document).ready(function(){ 
    $(".class2").on("change", function() { 
     // Some Action 
    }) 
}) 

$(document).ready(function(){ 
    $(".class3").click(function() { 
     // Some Action 
    }) 
}) 

謝謝你檢查這個問題了。祝你有美好的一天。對不起，如果這是一個重複的問題。發佈此問題是因爲無法在其他地方找到答案。

Answer 1

你可以使用grunt-jquery-ready來做你想做的事情。

你應該首先連接所有的文件，然後以這種方式使用這個grunt插件。我測試了這一點，它的工作原理

grunt.initConfig({ 
 
    'jquery-ready' : { 
 
     path: 'path_to_your_folder/your_script_file.js', 
 
     runSync: false 
 
    } 
 
    
 
    grunt.loadNpmTasks('grunt-jquery-ready'); 
 
    
 
    grunt.registerTask('default', "jquery-ready"); 
 
});

結果執行此我得到了我的這種格式的文件後：

$(document).ready(function(){ 
 
    all the content of my script.js file is placed here automatically. 
 
});

請參考主要網站更多信息：

Wrapping your concatenated .js file into ready function