comrades see that help me solve the packing problem
help solve the problem, and delete
- code is as follows
let fs = require("fs")
let path = require("path")
let process = require("process")
let babylon = require("babylon")
let t = require("@babel/types")
let traverse = require("@babel/traverse").default;
let generator = require("@babel/generator").default
let ejs = require("ejs")
// babylon ast
// @babel/traverse
// @babel/types
// @babel/generator
class Compiler {
constructor(config) {
this.config = config;
//
this.entryId; //" ./src/index.js"
//
this.modules = {};
this.entry = config.entry; //
this.root = process.cwd(); //
}
getSource(modulePath) {
let content = fs.readFileSync(modulePath, "utf8");
console.log(content,"contentsss")
return content
}
//
parse(source, parentPath) { //AST
//https://astexplorer.net/
//require("./a"),
let ast = babylon.parse(source);
let dependencies = []; //
traverse(ast,{
CallExpression(p) { //: a() b()
let node = p.node; //AST
if(node.callee.name === "require"){
node.callee.name = "__webpack_require__";
let moduleName = node.arguments[0].value; //
moduleName = moduleName + (path.extname(moduleName)?"":".js");//
moduleName ="./"+ path.join(parentPath, moduleName); //"src/a.js"
dependencies.push(moduleName); //()
node.arguments = [t.stringLiteral(moduleName)];
}
}
});
let sourceCode = generator(ast).code
return {sourceCode, dependencies}
}
//
buildModule(modulePath, isEntry) {
//
let source = this.getSource(modulePath);
// ID modulePath = modulePaht - this.root
// let moduleName = this.entry
let moduleName = "./"+path.relative(this.root,modulePath);
if(isEntry){ //true
console.log(moduleName, "moduleName");
this.entryId = moduleName; //
}
console.log("source:--->", source);
console.log("moduleName:--->", moduleName);
console.log("this.root:--->", this.root)
console.log("this.entry:--->", this.entry)
//source
let{sourceCode,dependencies} = this.parse(source, path.dirname(moduleName))
// console.log(sourceCode,dependencies,"sdependCode")
console.log("sourceCode:--->", sourceCode)
console.log("dependencies:--->", dependencies)
//
this.modules[moduleName] = sourceCode
dependencies.forEach(dep => { //
this.buildModule(path.join(this.root,dep),false);//false
})
}
emitFile() {
//
//
//
let output = this.config.output;
let main = path.join(output.path,output.filename);
console.log("-------")
//
// let templateString = fs.readFileSync(this.getSource(path.join(__dirname, "main.ejs")));
// https://stackoverflow.com/questions/51861832/nodejs-reading-file-enametoolong/51870822-sharp51870822
Code block segmentation the problem lies here in todo
// TODO root
let templateString = path.resolve(this.getSource(path.join(__dirname, "main.ejs")))
.replace(`/${this.root}\//`,"");
// console.log(templateString, "templateString");
console.log("-------");
let code = ejs.render(templateString,{entryId:this.entryId,modules:this.modules})
this.assets = {}
//
this.assets[main] = code;
// console.log("main",main)
fs.writeFileSync(main, this.assets[main]);
}
run() {
//
this.buildModule(path.resolve(this.root, this.entry),true);
console.log(this.modules,this.entryId)
//
this.emitFile();
}
}
module.exports = Compiler
The link is here. Please remember to create your own dist folder on the root directory.
https://github.com/yyccQQu/we...
https://github.com/yyccQQu/we...
guys, help me out. Thank you
.