正确使用需求

correct use of requirejs

本文关键字:需求      更新时间:2023-09-26

我试图在我的网站上设置需求,我有HTML模块,只希望在使用特定的HTML模块时加载JS。

我有这些文件和代码,它工作得很好,我只是想确保我做得正确。下面的例子是使用slick插件实现一个滑动条。我在index.php中包含的php保存了滑块的相关HTML。

脚本/模块/Sliderbanner.js

define(function(require) {
    var $ = require('jquery');
    var domReady = require('domready');
require('plugins/slick.min');
    domReady(function() {                  
            ///SLIDER BANNER
           $('.slider-banner').slick(});
        });
});

脚本/页面/sliderbanner.js

  require(['main'], function() {
        require(['jquery', 'modules/Sliderbanner'], function($) {
        });
    });

脚本/main.js

require.config({
    baseUrl: '../scripts',
    paths: {
        jquery:            'components/jquery/jquery',
        domready:          'components/requirejs-domready/domReady'
    },
    shim: {
        'slick.min': ['jquery']
    },
    urlArgs: "bust=" +  (new Date()).getTime()
});
define(function(require) {
    var $        = require('jquery');
    var domReady = require('domready');
    domReady(function() {
    });
});

index . php

 <?php include("../organisms/slider-banner.php");?>
      <script>require(['page/sliderbanner']);</script>

对你来说这看起来是正确的还是不正确的?我确实有一个疑问,如果我没有真正从模块传递任何东西到scripts/page/sliderbanner.js,我真的需要它吗?谢谢!

如果您将所有内容与r.js捆绑在一起,您的示例将正常工作。

如果你想异步加载你的JS文件,那么你需要这样做:

// module.js
define(['/path/to/module1.js', 'path/to/module2.js', function (module1, module2) {
  // ...
});
// some-other-module.js
define(['/path/to/module.js'], function (module) {
  // ...
});