在AMD中，导入和导出模块的代码，都必须放置在define函数中

    1. define([依赖的模块列表], function(模块名称列表){
    2.     //模块内部的代码
    3.     return 导出的内容
    4. })

    require.js

    案例
    image.png

    1. <!DOCTYPE html>
    2. <html lang="en">
    3. <head>
    4.     <meta charset="UTF-8">
    5.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
    6.     <title>Document</title>
    7. </head>
    8. <body>
    9.     <!--data-main="入口文件"   -->
    10.     <script data-main="./index.js" src="./require.js"></script>
    11. </body>
    12. </html>

    index.js 的代码

    1. // 官网文档的方式
    2. // define(["./b/b",'a'],function(b,a){
    3. //     console.log(b)
    4. //     console.log(a)
    5. // })
    7. // 以类似commonjs的方式
    8. define(function(require, exports, module){
    9.     const b = require('./b/b');
    10.     const a = require ( 'a')
    11.     console.log(a)
    12.     console.log(b)
    13. })

    a.js 的代码

    1. // 官网文档的方式
    2. // define([
    3. //     './b/b',
    5. // ], function(b) {
    6. //     console.log("a模块内部代码");
    7. //     return {
    8. //         data:'a模块的数据'
    9. //     }
    11. // });
    12. // 以类似commonjs的方式
    13. define(function(require, exports, module){
    14.     const b = require('./b/b');
    15.     console.log('这是a模块的数据');
    16.     module.exports = {
    17.         data: '这是a模块的数据'
    18.     }
    19. })

    b.js 的代码

    1. // 官网文档的方式
    2. // define( function() {
    3. //     const text = 123;
    4. //     console.log("这是b模块")
    5. //     return{
    6. //         name : "b模块",
    7. //         data: '这是b模块的数据'
    8. //     }
    10. // });
    11. // 以类似commonjs的方式
    12. define(function(require, exports, module){
    13.     console.log('这是b模块')
    14.     module.exports = {
    15.         name: ' b模块',
    16.         data: '这是b模块的数据'
    17.     }
    18. })

    运行结果
    image.png

    image.png
    运行前head里是没有引入这些js文件的，当代码执行后头部动态添加的