工程化

上次更新 2024年12月24日星期二 6:28:59 字数 392 字时长 2 分钟

写在前面

模块化与包管理器

// 定义模块
module.exports = {
  name: "commonjs",
};

// 引入模块
const commonjs = require("./commonjs"); // 必须以./、../开头
console.log(commonjs.name);

注意

// 定义模块
export default {
  name: "esm",
};

export const name = "esm";

import esm, { name } from "./esm.js";
console.log(esm.name, name);

html

<script type="module" src="./esm.js" />

注意

AMD 英文全称 Async Module Definition 异步模块定义基本不会在使用了

// 定义模块
define(["module"], function (module) {
  return {
    name: "amd",
  };
});

// 引入模块
define(["module"], function (module) {
  console.log(module.name);
});

CMD 英文全称 Common Module Definition 通用模块定义 sea.js（玉伯）实现了这个方案

// 定义模块
define(function (require, exports, module) {
  module.exports = {
    name: "cmd",
  };
});

// 引入模块
define(function (require, exports, module) {
  const cmd = require("./module.js");
  console.log(cmd.name);
});