码迷,mamicode.com
首页 > Web开发 > 详细

Webpack 4 学习03(配置入口和出口的进阶使用)

时间:2019-02-24 11:01:59      阅读:215      评论:0      收藏:0      [点我收藏+]

标签:master   ack   images   webp   使用   output   9.png   json   tps   

一、单出口形式

webpack.config.js

const path = require('path');


module.exports = {
  //单出口形式
  entry:['./public/index.js','./public/index2.js'],//有多个文件
  output:{
    path:path.resolve(__dirname,'build'),
    filename:'bundle.js'
  }
}

技术图片

  • 运行npm run dev

    生成唯一的打包文件 bundle.js

    技术图片

二、多出口形式

? webpack.config.js

const path = require('path');

module.exports = {
  //多出口形式
  entry:{
    entryOne:'./public/entryOne/index.js',
    entryTwo:'./public/entryTwo/index.js',
  },
  output:{
    path:path.resolve(__dirname,'build'),
    filename:'[name].js'
  }
}

?

  • 文件结构

    技术图片

  • 运行npm run dev

    • 生成两个打包文件

      技术图片

Webpack 4 学习03(配置入口和出口的进阶使用)

标签:master   ack   images   webp   使用   output   9.png   json   tps   

原文地址:https://www.cnblogs.com/hunterxing/p/10425287.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!