webpack入门使用

    在js文件中如果一个文件依赖另一个文件的某个变量,在另一个文件的这个变量需要放到全局中依赖它的文件才能访问到,全局变量的增加是危险的,特别是引入了一些js库文件后。nodejs的出现解决了这个问题:
在这里插入图片描述
    a依赖b中的msg,只需要在a中用require获取bjs文件的msg属性
在这里插入图片描述
    b文件将变量放到一个“出水口”module.exports中,a require 文件b.js就是require的这个出水口对象, require(’./b.js’).msg;便是这个需要的msg变量,所有的需要放出去的变量都可以放到这个“出水口”中。
    但这个require是node的命令浏览器并不能识别其,打包工具webpack的出现解决了这个问题


webpack安装

    webpack的安装,wenpack的安装需要先安装node,用node的npm命令:
install [email protected] -g@后是指定的版本
    npm卸载webpack:npm uninstall webpack -g

webpack 使用

webpack a.js bundle.js
    只需要把入水口js文件放进去,webpack会自动找依赖的出水口。

局部安装webpack

    在需要安装的目录执行命令
    ①首先创建一个package包
    npm init -y
    ②在当前目录下安装webpack: E:\sasslearing\node\test2>npm install [email protected] -D

    会出现版本号
在这里插入图片描述
   json加上执行命令
在这里插入图片描述
   执行命令:npm run pack 执行打包

猜你喜欢

转载自blog.csdn.net/weixin_42519137/article/details/84825682