webpack打包Js文件

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了webpack打包Js文件相关的知识,希望对你有一定的参考价值。

参考技术A

a .
注意点:index.js就是需要打包的文件打包之后的文件会放到dist目录中, 名称叫做main.js

b .
这句指令的含义是: 利用webpack将index.js和它依赖的模块打包到一个文件中
其实在webpack指令中除了可以通过命令行的方式告诉webpack需要打包哪个文件以外,
还可以通过配置文件的方式告诉webpack需要打包哪个文件

这句指令的含义是将webpack将index.js和他依赖的模块打包到一个文件中
其实webpack打包指令除了可以通知要打包哪些文件,还可以通过配置
2.2webpack常见配置

刚才是输入npx webpack index.js 那么现在就可以输入npx webpack了
如果想要使用其他指令,可以直接修改的 package.json 的scirpts

以后再打包的时候,就可以直接使用npm run test了;

当然,还可以看下devtool的取值,他生成的sourcemap映射表,对打包后的包的大小和打包速度有很大影响

如何解决webpack打包后,dist文件过大的问题

参考技术A webpack 把我们所有的文件都打包成一个 JS 文件,这样即使你是小项目
打包后的文件也会非常大。下面就来讲下如何从多个方面进行优化。

以上是关于webpack打包Js文件的主要内容,如果未能解决你的问题,请参考以下文章

WebPack打包React项目, 减小打包后生成的js文件.

如何理解webpack中的js文件的打包

webpack打包js,css和图片

Webpack - 把json文件打包进js文件

webpack4 系列教程: 打包JS

如何解决webpack打包后,dist文件过大的问题