webpack de escritura a mano (3)

El método de preparación de emitFile

  emitFile () {
     // 打包输出的路径 
    dejó principal = path.join ( este .config.output.path, este .config.output.filename) 
    console.log (principal, ' prueba ' )
     esta .assets = {}
     / /
     dejar templateStr = esta .getSource (path.join (__ dirname, ' main.ejs ' )); 
    dejar de código = ejs.render (templateStr, {EntryID: este .entryId, módulos: esta .modules})
     // 路径对应的代码
    esta .assets [principal] = código; 
    fs.writeFileSync (principal, este .assets [principal]) 
  }

La ruta de salida y la salida de nombre cosido ruta de salida en conjunto empaquetado
Declarar un objeto
La creación de main.ejs

En primer lugar , ejecute el comando: NPM i ejs -D re-creado en el contenedor de main.ejs

  
(función (módulos) { 
installedModules var = {}; 
función __webpack_require __ (moduleId) { 
si installedModules [moduleId]) {( 
installedModules de retorno .exports [ModuleID]; 
} 
var módulo = installedModules [moduleId] = { 
i: moduleId, 
l: falsas, 
las exportaciones: {} 
}; 
módulos [moduleId] .call (module.exports, módulo, module.exports, __webpack_require__); 
module.l = true; 
module.exports de retorno; 
} 
. __webpack_require retorno __ (__ __ webpack_require s = "<% -entryId%> "); 
}) 
/ *自执行函数传入参数* / 
({ 
<% para (clave en módulos) {%> dejar que 
"<% - tecla%>":  
(function (módulo, las exportaciones, __webpack_require__ ) {
eval (` <% - módulos [ clave]%> `); 
}),
<%}%>
       });

El archivo de paquete final generado por el método ejs.render
fs.readFileSync () se escribe en el archivo de salida ruta bundle.js.

dist abierta / bundle.js webpack-dev realiza a ejecutar código en vocode

salida:

hola A2020

Nuestra sencilla versión de prueba del éxito webpack manuscrita

Notas: https://app.yinxiang.com/fx/83b8b85b-c3c9-4bc2-8881-da5dc3f99947

Código: https://gitee.com/guangzhou110/handwritten_webback

webpack de escritura a mano (3)

Supongo que te gusta