webpack笔记（ 八 ）- 入口 & 出口

目录:

1. 前置知识
   • ./的双重含义
   • __dirname
   • node中的path模块
2. 入口
3. 出口

前置知识

咱们先来说说这个./

1. 在模块化代码中, 比如require, ./表示当前JS文件所在的目录
2. 在路径和文件处理中, ./表示node运行目录

__dirname

所有情况下, __dirname都表示当前运行的JS文件所在的目录, 不过他是一个绝对路径

console.log(  __dirname ); // 必须在node环境中使用

node中的path模块

顾名思义, path模块中提供了大量路径处理的函数。我们这里只铺垫一个

• path.resolve: 组装绝对路径。

  我们可以来用一用, 同时也可以验证一下./在处理路径的时候的规则定义

  在根目录下创建index.js

  // index.js
  const path = require('path');
  const result = path.resolve("./", "index");
  console.log(result);
  

  根目录命令行中敲node index.js

  输出: /Users/macbook/Desktop/桌面 - MacBook Pro/LearnNotes/前端学习笔记/webpack/1.wepackCore/1-8.entry & output/index

  上面是笔者的输出result结果, 然后你们试验的话肯定输出的不一样（ 因为他会根据你们自己的文件盘服来组装路径 ）

入口

入口其实配置的是chunk对应的入口模块, 默认配置的是main chunk的入口模块路径, 使用entry属性控制

module.exports = {
   
    mode: 'development',
    entry: {
   
        // 属性名: chunk的名称, 属性值: 入口模块
        main: './src/index.js', // 默认就是这个配置
    }

    // 上面的entry为标准的对象写法, 一般如果你只配置mainchunk你可以简写如下:
    // entry: './src/index