讲稿6 rn工程化webpack day3课堂

Webpack-手写一个bundle.jsgnbtwtgaiaconsole.log("hellomodule.exports={console.log(source,this,this.query);returnconstpath=require('path')module:{rules:test:use:path.resolve(dirname,loader-module:{rules:test:/\.js$/,use:[loader:path.resolve(dirname,"./loader/replaceLoader.js"),options:{name:"开课吧//constloaderUtilsrequire("loader-utils");//官方推荐处理loader,querymodule.exports=function(source)//returnsource.replace("kkb",);constoptions=loaderUtils.getOptions(this);constresult=source.replace("kkb",returnsource.replace("kkb",constloaderUtilsrequire("loader-utils");//官方推荐处理loader,querymodule.exports=function(source)constoptions=constresult=source.replace("kkb",);this.callback(null,result);err:Error|null,content:string|Buffer,sourceMap?:SourceMap,meta?:anyconstconstloaderUtils=require("loader-module.exports=function(source)constoptions=loaderUtils.getOptions(this);setTimeout(()=>{constresult=source.replace("kkb",return},constconstloaderUtils=require("loader-module.exports=function(source)constoptions=//callback就是this.callback注意参数的使用constcallback=this.async();setTimeout(()=>{constresult=source.replace("kkb",);callback(null,result);},module.exports=returnsource.replace("开课吧",constloaderUtils=require("loader-utils");module.exports=function(source){constoptions=constcallback=this.async();setTimeout(()=>constresult=source.replace("kkb",);callback(null,result);},module:{rules:test:/\.js$/,use:[path.resolve(dirname,loader:path.resolve(dirname,"./loader/replaceLoaderAsync.js"),options:{name:"开课吧//use:[path.resolve(dirname,resolveLoaderresolveLoader:modules:["node_modules",{rules:test:/\.js$/,use:[loader:"replaceLoaderAsync",options:{name:"开课吧//use:[path.resolve(dirname,:classclassCopyrightWebpackPluginconstructor()apply(compiler)module.exports=constconstCopyrightWebpackPlugin=require("./plugin/copyright-webpack-plugins:[newplugins:[CopyrightWebpackPlugin({ame"开课吧classCopyrightWebpackPlugin{constructor(options)apply(compiler)module.exports=classclassCopyrightWebpackPlugin{constructor(options){//apply(compiler)//hooks.emit(compilation,cb)=>{{source:function(){return"hellosize:{return//pile.tap("CopyrightWebpackPlugin",compilation=>//console.log("开始了module.exports="debug":"node--inspect--inspect-webpackwebpack在执行npxwebpack((function(modules)varinstalledModules=functionwebpack_require{if(installedModules[moduleId])returnreturnvarmodule=(installedModules[moduleId]{i:moduleId,l:false,exports:{}module.l=true;returnmodule.exports;returnwebpack_require((webpack_require.s="./index.js":function(module,{'//importafrom"./a";\n\nconsole.log("helloword");\n\n\n//#constconstfs=constfenximokuai=filename=>constcontent=fs.readFileSync(filename,"utf-8");我们推荐使用ab/paser，这是7的工具，来帮助我们分析内部的语法，包括e6，返回astnpminstall@babel/parser--constfs=constparser=constfenximokuai=filename=>constcontent=fs.readFileSync(filename,"utf-constAst=parser.parse(content,{sourceType:"module"constconstfs=require("fs");constpath=require("path");constparser=consttraverse=constfenximokuai=filename=>constcontent=fs.readFileSync(filename,"utf-constAst=parser.parse(content,{sourceType:"module"constdependencies=traverse(Ast,{ImportDeclaration({node{constparser=//修改dependenciesconstdependencies=constnewfilename="./"+path.join(path.dirname(filename),dependencies[node.source.valuenewfilename;constconstbabel=const{code}=babel.transformFromAst(Ast,null,{presets:["@babel/preset-env"]returnreturnconstconstfs=require('fs');constpath=require('path');constparser=consttraverse=require('@babel/traverse').default;constbabel=require('@babel/core');constmoduleAnalyser=(filename)=>constcontent=fs.readFileSync(filename,'utf-8');constast=parser.parse(content,{sourceType:constdependencies={};traverse(ast,{ImportDeclaration({node})constdirname=constnewFile='./'+path.join(dirname,node.source.value);dependencies[node.source.value]=newFile;const{code}=babel.transformFromAst(ast,{presets:["@babel/preset-{constconstmoduleInfo=moduleAnalyser('./src/index.js');constfs=require('fs');constpath=require('path');constparser=consttraverse=require('@babel/traverse').default;constbabel=require('@babel/core');constmoduleAnalyser=(filename)=>constcontent=fs.readFileSync(filename,'utf-8');constast=parser.parse(content,{sourceType:constdependencies={};traverse(ast,{ImportDeclaration({node})constdirname=constnewFile='./'+path.join(dirname,node.source.value);dependencies[node.source.value]=newFile;}const{code}=babel.transformFromAst(ast,{presets:["@babel/preset-{filename,}}constmakeDependenciesGraph=(entry){constentryModule=moduleAnalyser(entry);constgraphArray=[entryModule];for(leti=0;i<graphArray.length;{constitem=constconst{dependencies}=item;if(dependencies){for(letjin{graphArray.push(constgraph={};graphArray.forEach(item=>{graph[item.filename]{dependencies:item.dependencies,code:item.codereturnconstgraghInfo=constfs=require('fs');constpath=require('path');constparser=consttraverse=require('@babel/traverse').default;constbabel=require('@babel/core');constmoduleAnalyser=(filename)=>constcontent=fs.readFileSync(filename,'utf-8');constast=parser.parse(content,{sourceType:constdependencies={};traverse(ast,{ImportDeclaration({node})constdirname=constnewFile='./'+path.join(dirname,node.source.value);dependencies[node.source.value]=newFile;const{code}=babel.transformFromAst(ast,{presets:["@babel/preset-return}}constmakeDependenciesGraph=(entry){constentryModule=module