最基本配置

webpack有四大核心概念：

• 入口(entry)：程序的入口js
  
• 输出(output)：打包后存放的位置
  
• loader：用于对模块的源代码进行转换
  
• plugins：插件的目的是解决loader无法实现的其他事

第一步：创建 webpack.config.js

• webpack.config.js 文件默认应放置在项目根目录下
• 不放在根目录时，可以通过命令行的--config config_path 指定配置文件路径

// webpack.config.js 
const path = require('path')
module.exports = {
  // 入口 可以是相对路径
  entry: './src/index.js',
  // 出口， 必须是绝对路径
  output: {
    // path.join()和 path.resolve()都可以
    path: path.join(__dirname, '/dist/'),
    //path: path.resolve('./dist'), path.resole方法将相对路径解析为绝对路径
    filename: 'bundle.js'
  },
  // 模式选择，production 和 development，默认production
  mode: 'development'
}

第二步：运行 webpack

此时还没有在 package.json 文件中配置webpack命令，还是使用 npx 命令。

npx webpack