webpack的深度理解 叁歲伎倆 2022-12-13 11:25 111阅读 0赞 1、什么是webpack 模块化的打包工具 webpack默认可以处理js、json文件 2、什么是打包 将模块化语言如 .vue .ejs .sass 打包成浏览器能识别的css、js、jpg等 3、模块 entry:入口配置 ouput:出口 loader:解析模块、识别除了js、json的语言 plugin:插件 loader loader 告诉 webpack 加载 CSS 文件,或者将 TypeScript 转为 JavaScript。为此,首先安装相对应的 loader: webpack配置文件 webpack.config.js: let path = require('path') let webpackMerge = require('webpack-merge') module.exports = { entry:'./src/index.js', output:{ filename:"bundle.js", path:path.resolve(__dirname,'dist') }, rules: [ { test: /\.css$/, use: 'css-loader' }, { test: /\.ts$/, use: 'ts-loader' } ], mode:'development' } webpack的打包原理 把所有依赖打包成一个bundle.js文件,通过代码分割成单元片段并按需加载。 找到“require”、“exports”、“define”等关键词,并替换成对应模块的引用
还没有评论,来说两句吧...