zl程序教程

您现在的位置是:首页 >  其他

当前栏目

利用webpack-war-plugin打war包

2023-03-14 22:55:31 时间

如何使用 webpack 将前端打成 war 包呢?其实 webpack 的插件库中提供了一个叫 webpack-war-plugin 的插件,可以很便捷的做到这一点。

先提供一下插件地址

  • 安装 webpack-war-plugin
npm install -D webpack-war-plugin
复制代码
  • 我这里是 vue-cli3 的环境,所以需要先新建 vue.config.js 文件
"use strict";
const { WebpackWarPlugin } = require("webpack-war-plugin");
// 开发模式
const isDevMode = process.env.NODE_ENV === "development";

const plugins = [];

// 只有在打包时才需要用到 webpack-war-plugin 这个插件
if (!isDevMode) {
  plugins.push(
    new WebpackWarPlugin({
      archiveName: "test",
      webInf: "./web-inf",
      additionalElemens: [
        { path: "context/context.xml", destPath: "META-INF/context.xml" },
        { path: "package.json" },
        { path: "images", destPath: "assets/images" },
      ],
    })
  );
}

let webpack = {
  plugins,
};

module.exports = {
  configureWebpack: webpack,
};
复制代码
  • 最后运行 npm run build 进行打包,我这里报了一个缺少 core-js 库中一个文件的错误,我重新安装了一下 core-js 就好了。