webpack基础使用
Posted (⊙o⊙)买噶
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了webpack基础使用相关的知识，希望对你有一定的参考价值。
安装webpack：0.在全局安装webpack npm install webpack -g(如果不在全局装一个webpack，局部的会不识别) 1.通过命令行进入项目安装目录，2.输入npm init 3.npm webpack --save-dev
webpack打包：格式 webpack 需要打包的文件名 打包之后的文件名 例如：webpack helloWorld.js helloWorld.bundel.js
操作成功之后会给出我们一部分信息：1.Hash：哈希值 2.Version：webpack的版本 3.Time：大这次包所花费的时间 4.Asset：这次打包生成的文件 5. Size这是打包的大小 6. Chunks:这次打包的分块
7.Chunk Names：这次打包的快名称
打包的时候用--watch 来监听打包文件的变换，从而文件改变就打包 例如：webpack helloWorld.js helloWorld.bundel.js --watch
loader的引用 : 打包过程中有一些需要我们自己安装一些loader （如css文件，style） npm install css-loader style-loader --save-dev ，还需要 require(‘style-loader!css-loader!./style.css‘)=>
也可以在打包的时候加上 --module-bind ‘css=style-loader!css-loader‘（推荐） 例如：webpack helloWorld.js helloWorld.bundel.js --module-bind ‘css=style-loader!css-loader‘
webpack参数：1：watch:监听 2.proggress:打包过程 3.display-modules：查看打包的模块 4.display-reasons:为什么打包这个模块的原因告诉我们
以上是关于webpack基础使用的主要内容，如果未能解决你的问题，请参考以下文章