webpack的使用场景
webpack是一个静态模块打包工具,作用是打包,具体直白点就是现在前端开发越来越强大,里面有很多新的语法浏览器不支持,webpack可以把这些不支持的语法进行编译为浏览器支持的语法,从而可以直接在浏览器中渲染。同时可以把文件进行压缩,这样可以减小文件的大小,加快文件的请求。
webpack的安装分为全局安装和局部安装
首先说全局安装
webpack也是一个包,所以想要安装webpack,先要有包管理工具npm。所以第一步先安装node node安装去node官网下载node,然后一直下一步就可以了。node地址nodejs.org/zh-cn/ webpack的使用对node的版本有要求,建议安装最新的稳定的node版本 然后在终端执行 npm install webpack webpack-cli -g (-g)表示的是全局安装 上代码
安装完成以后,输入命令 webpack --version 可以查看安装的webpack版本。
当你需要打包的时候,在终端执行webpack命令就可以了,这时候就会出现一个打包好的文件夹,说明打包成功;
全局安装,对于只有一个文件和练习使用还可以,当你的包多的时候,每个包依赖的webpack版本不一样时,在直接使用webpack就没有意义了,因为不同版本的webpack有兼容问题。
下面介绍局部安装
上代码
第一点注意安装的路径地址,在你文件的根目录进行安装
第二点package.json文件中的name名字不要用webpack这个关键子字。我的这里当初用默认名字的时候报错了,最后改为了webpacktest.
第三点 在package.json文件中加上webpack的命令,以后打包的时候,直接执行npm run build就可以了
上代码