webpack 基本打包方法

最新推荐文章于 2025-09-12 15:47:36 发布

转载最新推荐文章于 2025-09-12 15:47:36 发布 · 61 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/liangfengbo/p/8391306.html

文章标签：

#webpack #ViewUI

本文介绍了一个简单的Webpack配置案例，展示了如何通过webpack.config.js文件来指定打包的入口文件和输出文件的名称及格式。同时提供了add.js和app.js两个示例文件，演示了模块的导出与导入，并详细说明了配置项的设置。

webpack的打包基本配置文件webpack.config.js

可以在webpack.config.js里面写好配置：比如前章节所总结的四大核心

|-- add.js
// 定义一个普通加法函数
export default function (a, b) {
  return a + b;
}

|-- app.js
// 引用使用
import add from './add';
console.log(add(1, 2));

|-- webpack.config.js
// 对入口app.js文件打包
module.exports = {
  entry: {
    // 入口
    app: './app.js'
  },
  output: {
    // 输出文件： 名字 + 8位的hash值
    filename: '[name].[hash:8].js'
  }
}