解决方法:因为没有安装对应包,需要安装一下:
成功后在package.json中可以查看依赖包
4:在安装时可能会报错不存在webpack一些问题,安装之前需要初始化:
初始化完成后项目中将存在json文件和node_modules:
5:如果全局安装,现在又想本地安装,需先删除全局:
6:NPM错误!在1:257的基准下没有找到任何值
解决方法:
1.卸载本地node
2.删除本地 ../AppData/Roaming/npm ../AppData/Roming/npm-cache 这两个文件夹
windows命令path查看你的位置在哪里 我本地位置:C:\Users\***\AppData\Roaming\npm C:\Users\***\AppData\Roaming\npm-cache
3.重新下载安装node
官网地址:https://nodejs.org/en/
4.检查node安装是否成功
>node -v --查看node版本
>npm -v --查看npm版本
>npm install webpack -g --安装webpack
>webpack -h --查看webpack版本
如果以上命令执行都ok,那么恭喜你,环境已经安装好了。
四:webpack可以做什么呢1:webpack可以处理js间的相互依赖关系
2:webpack能处理js的兼容问题,把高级的浏览器不识别的语法转为低级的能正常识别的语法
五:配置文件webpack.config.js配置打包文件出口入口
命令行直接运行命令打包
注意:可能会出现错误:
解决方法:命令行打包时既没有给出口入口文件,也没有配置文件进行配置出入口
过程分析:当我们在控制台直接输入webpack命令执行的时候,webpack做了以下几步:
1:首先webpack发现,我们并没有通过命令的形式,给它指定入口和出口
2:webpack就会去项目的根目录中区查找一个叫做webpack.config.js的配置文件
3:当找到这个配置文件后,webpack会执行并解析这个配置文件,会得到配置文件中导出的配置对象
4:当webpack拿到配置对象后,就拿到了配置对象中指定的入口和出口,然后进行打包构建
六:使用webpack-dev-server工具,实现自动打包编译功能简介:是一个小型node.js express服务器,新建一个开发服务器,可以serve我们pack以后的代码,并且当代码更新的时候自动刷新浏览器,启动webpack-dev-server后,你在目标文件夹中是看不到编译后的文件的,实时编译后的文件都保存到了内存当中。
本地安装:
注意:安装完后直接执行命令会报错