如何用webpack.js将多个js文件打包成库_js能不能打包成库-优快云博客

本文介绍如何使用Webpack打包包含多个相互依赖文件的JavaScript项目，确保所有函数和模块正确加载，使用户能在主index页面直接调用。通过配置webpack.config.js文件，设置入口、输出路径和文件名，实现模块化代码的有效打包。

想要打包多个文件，在多个文件下有各个文件的相互调用，如在下例文件下要调用其他文件里的函数

var AnimateDomManage = require("./animatedommanager.js");
var AnimateEditor = require("./animateeditor.js");
var AnimateEnhancer =  require("./animateenhancer.js");
var FunctionHub = require("./functionhub.js");
var GeometryDefiner = require("./geometrydefiner.js");
var GeometrySaver = require("./geometrysaver.js");

window.function(){
    
}

window.function2(){
    
}

想要打包后某个函数在自己的主index页面可以直接调用，要加上window, eg,.

window.function1(){
    
}

建立下述文件

webpack.config.js

const path = require("path")
module.exports = {
	entry:{
    	ant: "./src/js/ant.js"
    },
    output: {
    	filename: "marchingants.js" ,
        path: path.resolve(__dirname, "../out")
    },
}

在命令行自己的文件夹目录下敲命令

webpack --config config/webpack.config.js

ps: 两个学习视频，就是看了下面的两个视频学的