webpack安装的问题

//安装全局的webpack和脚手架
npm install webpack@5.72.1 -g
npm install webpack-cli -g

使用官方文档的webpack依赖的会出现使用run fund的问题，给出的解决方法是run fund，npm run dev，npm install --no-fund。

解决
在项目中可以使用终端，添加一个版本号下载就成功了

npm install webpack@5.72.1 --save-dev

成功后package会出现，这个是开发依赖

"devDependencies": {
    "webpack": "^5.72.1"
  }

//查看脚手架和webpack是否安装成功，安装成功会出现版本号
webpack -v

这里语法也是出现问题，但是主要问题是系统禁止运行脚本
解决方法：
vscode禁止运行此脚本的你们管理员运行vscode然后先执行set-executionpolicy remotesigned再执行webpack命令

这里的语法是想要将src文件下面的main.js打包给到dist文件的bundle.js
bundle.js不用新建，webpack回自己 *** 作
这里的语法是在webpack4.0以前可以使用

 webpack ./src/main.js ./dist/bundle.js

4.x版本的使用这个命令：

npx webpack ./src/main.js -o ./dist/bundle.js --mode development

5.0版本

webpack --entry ./src/main.js -o ./dist --mode=development

如果出现了创建的bundle.js是个文件夹。可以先使用config.js

// 使用node语法获得动态路径
const path = require("path");
// 第一步 npm init 初始化
// 第二步使用英文命名全部都是yes直接生成package.json，然后可以自己设置
module.exports = {
  // 入口
  entry: "./src/main.js",
  // 出口
  output: {
    // 动态获取路径
    // todo resolve相当于从__dirname（根路径）开始,cd到后面的路径;
    // todo join是把__dirname与后面的路径进行拼接
    // path: "./dist",
    // path 模块的resolve函数
    // !两个下划线
    path: path.resolve(__dirname, "dist/bundle.js"),
    filename: "bundle.js",
  },
};

局部打包语句

node_modules/.bin/webpack

随后会出现一个安装脚手架的提示yes在输入这行语句
也可以在package.json里面的script添加

"build": "webpack"

这样webpack就和build绑定，可以使用npm run build运行，就不用管路径