webpack的基本使用

webpack使用步骤

• 1.命令webpack webpack-cli
  • 在根目录下运行cnpm install webpack webpack-cli -D
• 2.在根目录下创建src文件夹，即开发环境目录
  • src文件夹中必须要有一个入口文件，用来连接其他模块。
• 3.在根目录下创建webpack.config.js文件 因为webpack在执行的时候默认会找到根目录下的webpack.config.js文件
• 4.在webpack.config.js文件中写配置项

  • 第一步 拿到path模块

    const path = require("path");
    

  • 第二步 配置入口文件和出口文件地址

    const PATH = {
        app:path.join(__dirname,"./src/main.js"),
        build:path.join(__dirname,"./dist")
    }
    

  • 第三步 在main.js中测试

• 5.打包命令（初级使用，后期不会这样使用）
  • npx webpack

琐碎概念

-D: --save-dev 当前依赖要安装到开发环境中去

-S: --save 当前依赖要安装到生产环境中去

解释何为path

webpack是基于nodejs,所以可以在webpack中使用commonJS

const path = require("path");
/*获取当前页面的绝对路径*/
console.log(__dirname);

/*将当前文件路径和src文件夹拼接在一起*/
console.log(path.join(__dirname,"./src"))

npx : 默认从当前文件的node_modules中找到相对应的模块