局部安装webpack
npm i webpack@3.6.0 --save-dev
使用webpack
初体验:
index.html是源html文件
src有js文件夹,image...math.js
里面就是这样的,我们不用管它
bundle.js
现在再在index中引入刚刚生成的bundle文件,就能使用了
index.html
使用的结果:
但是每次命令行这么长非常的麻烦...,有没有办法能够让我们输入webpack就自动帮我们打包对应的文件到对应的文件夹里呢
首先新建一个文件夹
第一步: 初始化:
npm init -y
很庆幸学了node,到这里能听懂...style-loader,暂时不写
webpack.config.js
现在运行npm run build,打开index.html看看效果
没有任何效果的哈,背景也没变色
这是因为CSS-loader...但是我们生成的图片的名字很长,是一个32位的哈希值,为了避免重复的.但是在真实开发中,我们可能对打包的名字有一定的要求,比如在所有的图片放在一个文件夹中,跟上图片原来的名称,同时也要防止重复
webpack.config.js