jdpack-hsh 1.0.0

package/bin/index.js

@@ -0,0 +1,14 @@
+#! /usr/bin/env node
+
+// console.log('jdpack 打包功能')
+// console.log(process.cwd()) // 打印当前命令所处的目录
+
+const Compiler = require("../lib/Compiler")
+const path = require('path')
+const configPath = path.resolve(process.cwd(), 'webpack.config.js')
+const configObj = require(configPath)
+// console.log(configObj)
+
+const compile = new Compiler(configObj)
+compile.run()
+console.log(compile.modules)

package/lib/Compiler.js

@@ -0,0 +1,125 @@
+/**
+ * 编译代码 生成打包后的内容
+ * 根据配置文件 entry 入口文件
+ * 生成依赖对象
+ * 传递给 webpack 自执行函数
+ *
+ */
+const fs = require('fs');
+const ejs = require('ejs')
+const path = require('path');
+
+/**
+ * 导入ast相关模块
+ */
+const { parse } = require('@babel/parser')
+const generator = require('@babel/generator').default
+const traverse = require('@babel/traverse').default
+const t = require('@babel/types')
+
+
+class Compiler {
+    /**
+     * 配置文件
+     * @param config
+     */
+    constructor(config) {
+        this.config = config
+        this.modules = {} // 模块依赖对象 保存代码里面所有的模块依赖关系 key 模块依赖路径 value 模块
+    }
+    run() {
+        this.buildModules(this.config.entry)
+
+        // 生成bundle.js
+        this.generatorBundlejs()
+    }
+
+    /**
+     *
+     * @param moduleId 依赖模块的路径
+     */
+    buildModules(moduleId) {
+        let code = this.getCode(moduleId)
+        let { deps, newCode } = this.parseModule(code)
+        this.modules[moduleId] = newCode
+        // console.log(deps, newCode);
+        // 针对 deps 里面再次做处理 引入的依赖文件里面可能还有require 
+        deps.forEach(item => {
+            this.buildModules(item)
+        })
+        // 根据依赖对象打包生成代码
+        
+    }
+    /**
+     * 将代码里面的依赖做替换
+     */
+    parseModule(code) {
+        let mainRootPath = path.dirname(this.config.entry)
+        let deps = [] //  存储了代码里面所有的依赖路径
+        const ast = parse(code)
+        // console.log(ast);
+        // 对require节点做替换 替换成 __webpack_require__
+        traverse(ast, {
+            CallExpression(NodePath) {
+                let node = NodePath.node
+                // console.log(node.callee.name)
+                if (node.callee.name === 'require') {
+                    node.callee.name = '__webpack_require__'
+                    // 对依赖路径做替换
+                    let depPath = node.arguments[0].value
+                    if (!path.extname(depPath)) {
+                        depPath += '.js'
+                    }
+                    depPath = '.\\' + path.join(mainRootPath, depPath)
+                    depPath = depPath.replace(/\\/g, '/')
+                    node.arguments[0] = t.stringLiteral(depPath)
+                    // console.log(depPath)
+                    deps.push(depPath)
+                }
+                
+            }
+        })
+        let newCode = generator(ast).code
+        // console.log(newCode)
+        return { deps, newCode }
+    }
+
+    /**
+     * // 入口文件里面的内容跟 如果有其他的require 进行再次生成依赖对象
+        // 现根据生成的入口文件的依赖对象 生成打包文件
+     */
+    generatorBundlejs() {
+        /**
+         * 使用ejs根据依赖对象 生成打包后的bundle.js文件
+         *  1 读取模板
+         *  2 使用ejs 做模板
+         *  3 将打包后的内容根据webpack.config.js 里面的output保存
+         */
+        let bundlePath = path.resolve(__dirname, 'bundlejsTemplate.ejs')
+        let bundleTemplate = fs.readFileSync(bundlePath, 'utf-8')
+        // console.log(bundleTemplate)
+        let renderCode = ejs.render(bundleTemplate, {
+            moduleId: this.config.entry,
+            modules: this.modules
+        })
+        // console.log(renderCode)
+        let outputPath = this.config.output.path
+        // 判断输出路径是否存在 否则创建
+        if (!fs.existsSync(outputPath)) {
+            fs.mkdirSync(outputPath)
+        }
+        let outputFilePath = path.resolve(outputPath, this.config.output.filename)
+        fs.writeFileSync(outputFilePath, renderCode)
+    }
+
+
+    /**
+     *
+     * @param modulePath 模块依赖的路径
+     */
+    getCode(modulePath) {
+        return fs.readFileSync(modulePath, 'utf8')
+    }
+ }
+
+module.exports = Compiler

package/lib/bundlejsTemplate.ejs

@@ -0,0 +1,98 @@
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, { enumerable: true, get: getter });
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// define __esModule on exports
+/******/ 	__webpack_require__.r = function(exports) {
+/******/ 		if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
+/******/ 			Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+/******/ 		}
+/******/ 		Object.defineProperty(exports, '__esModule', { value: true });
+/******/ 	};
+/******/
+/******/ 	// create a fake namespace object
+/******/ 	// mode & 1: value is a module id, require it
+/******/ 	// mode & 2: merge all properties of value into the ns
+/******/ 	// mode & 4: return value when already ns object
+/******/ 	// mode & 8|1: behave like require
+/******/ 	__webpack_require__.t = function(value, mode) {
+/******/ 		if(mode & 1) value = __webpack_require__(value);
+/******/ 		if(mode & 8) return value;
+/******/ 		if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
+/******/ 		var ns = Object.create(null);
+/******/ 		__webpack_require__.r(ns);
+/******/ 		Object.defineProperty(ns, 'default', { enumerable: true, value: value });
+/******/ 		if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
+/******/ 		return ns;
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "";
+/******/
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = "<%-moduleId%>");
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/
+ <% for (let key in modules) { %>
+  "<%-key%>": (function(module, exports, __webpack_require__) {
+
+  <%-modules[key]%>
+
+
+/***/ }),
+  <% } %>
+/******/ });

package/package.json

@@ -0,0 +1,23 @@
+{
+  "name": "jdpack-hsh",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "bin": {
+    "jdpack": "./bin/index.js"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "type": "commonjs",
+  "dependencies": {
+    "@babel/generator": "^7.29.1",
+    "@babel/parser": "^7.29.0",
+    "@babel/traverse": "^7.29.0",
+    "@babel/types": "^7.29.0",
+    "ejs": "^4.0.1"
+  }
+}