webpack（1）

webpack

• • • 1.认识webpack
    • 3.vue加载的资源
    • 4.webpack将各种文件转换为浏览器可识别文件
    • 5.webpack使用前提
    • 6.webpack-cli
    • 7.webpack的全局与局部安装
    • 8.更改入口文件

1.认识webpack

2.webpack到底是什么

3.vue加载的资源

4.webpack将各种文件转换为浏览器可识别文件

5.webpack使用前提

6.webpack-cli

7.webpack的全局与局部安装

1.全局安装
所有项目都使用同一个版本

npm init -y

安装完成

2.局部依赖
不同版本使用不同版本

npm install webpack webpack-cli --save-dev

安装完成

3.打包
1.直接使用webpack是使用的全局webpack

2.可以通过查找nodemodul来执行局部webpack打包
npx webpack
也可以使用这个
3.第二种操作可以编剧脚本
打开webpack.json

然后使用 ==npm run build == 他会去node_module的bin中找webpack进行打包

8.更改入口文件

配置webpack文件

//导入路径
const path = require('path');

module.exports = {
    //程序入口
  entry: "./src/main.js",
  output: {
      //拼接路径
    path: path.resolve(__dirname, "./build"),
    //打包文件名
    filename: "bundle.js"
  }
}

package.json会自动读取配置文件