webpack打包之 copy-webpack-plugin

copy-webpack-plugin 打包复制文件插件。
1、什么时候要使用?
在离线应用中,前端所有文件都需在在本地,有些文件(比如iconFont以及一些静态img)需要转为离线文件,这些文件可以直接引用更方便些,这就需要在打包时直接复制到打包文件下。
2、安装依赖

npm i copy-webpack-plugin --save-dev

3、配置webpack

const compressionPlugin = require('compression-webpack-plugin');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const path = require("path");
module.exports = {devServer: {//开发环境的跨域问题解决,后端服务ip 和 端口proxy: {'/eom': {target: 'http://127.0.0.1:7000',changeOrigin: true},'/pangu': {target: 'http://127.0.0.1:7000',changeOrigin: true},/**调用字典配置 */'pangu/eom/asset': {target: 'http://127.0.0.1:9003',changeOrigin: true,pathRewrite: {'^/pangu/eom/asset': '/eom/asset'}}}},pages: {index: {// page 的入口entry: 'src/TdPluginEomServiceMain.js',// 模板来源template: 'public/index.html',// 输出文件名filename: 'index.html'}},publicPath: './',assetsDir: './eom',lintOnSave: false,productionSourceMap: false, //打包加密filenameHashing: process.env.NODE_ENV === 'production' ? false : true,configureWebpack: () => {if (process.env.NODE_ENV === 'production') {return {plugins: [new compressionPlugin({test: /\.js$|\.html$|\.css/,threshold: 10240,deleteOriginalAssets: false}),new CopyWebpackPlugin([{from: path.resolve(__dirname, './src/static'),  //文件资源路径to: path.resolve(__dirname, './dist/eom/assets'),//复制文件要到的目的路径ignore: ['.*']}]) //打包静态资源],output: {jsonpFunction: 'TdPluginEomServiceMain'}};}}
};

4、打包
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/3190.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

6.6Jmeter远程调度Linux机器Jmeter测试

1、配置Agent和启动 1.1、打开jmeter/bin目录下的jmeter.properties 1、server_port1099取消注释 2、remote_hosts127.0.0.1 改为remote_hosts127.0.0.1:1099 或者是remote_hostsAgent机的ip:1099 3、server.rmi.localport1099 4、server.rmi.ssl.disablefalse改为true&#x…

matlab 一维数组拼接,多个一维数组合并成一个一维数组

目录 matlab 一维数组拼接,多个一维数组合并成一个一维数组 1、一维数组直接合并 直接将两个矩阵合并: 2、一维数组交叉合并: 方法一: 方法二: 方法三: 方法四: 其他操作: matlab 一维…

店招新品之创意LED显示屏之LED魔方屏的特点

LED魔方屏也被称之为立方体LED显示屏、六面体LED显示屏等,每个显示面之间实现了无缝拼接,运用技术前沿的箱体设计工艺,通过跟实际安装场景相结合,打造出更具创意的LED显示屏产品,LED魔方屏以独特的造型吸引用户&#x…

OceanBase 4.1上云,OB Cloud助力企业降本增效

近日,OB Cloud 正式上线 OceanBase 4.1 新版本,支持企业在云上使用最新的 OceanBase 单机分布式一体化架构能力。去年8月OceanBase 宣布公有云服务全球开服,伴随4.1版本推出,OceanBase公有云正式命名为OB Cloud云数据库。 在本次…

基于springboot+Redis的前后端分离项目之分布式锁(四)-【黑马点评】

🎁🎁资源文件分享 链接:https://pan.baidu.com/s/1189u6u4icQYHg_9_7ovWmA?pwdeh11 提取码:eh11 分布式锁 分布式锁1 、基本原理和实现方式对比2 、Redis分布式锁的实现核心思路3 、实现分布式锁版本一4 、Redis分布式锁误删情况…

Ubuntu 22.04 配置 QGIS二次开发环境

源码地址,以及官方指导文档地址 源码地址:https://github.com/qgis/QGIS/releases QGIS 官方指导文档地址:https://github.com/qgis/QGIS/blob/release-3_26/INSTALL.md(此处为3.26的指导文档,可以自行修改查看&#…

基于SpringBoot+Vue+微信小程序的电影平台

✌全网粉丝20W,csdn特邀作者、博客专家、CSDN新星计划导师、java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌ 🍅文末获取项目下载方式🍅 一、项目背景介绍: 研究背景:…

Hyperledger Fabric测试网络的准备和基本使用

文章目录 相关安装启动测试网络创建channel打包链码安装链码包通过链码定义链码定义提交给通道调用链码关闭网络遇到的问题1.docker保持启动状态2.忘起测试网络了3.Java版本过高,推荐1.8 相关安装 npm、node、git、docker、docker-compose。docker保证一直运行 serv…

基于springboot的微信小程序宠物领养医院系统(源代码+数据库+10000字论文)085

基于springboot的微信小程序宠物领养医院系统(源代码数据库10000字论文)085 一、系统介绍 本项目有网页版和小程序端 本系统分为管理员、医生、用户三种角色 用户角色包含以下功能: 登录、注册、宠物领养、医生在线咨询、查看挂号、个人中心、密码修改、宠物寄…

【微信小程序】使用weui组件库来实现弹出一个确认的弹窗popup,其中包含图片和名称

在微信小程序中&#xff0c;你可以使用weui组件库来实现弹出一个确认的popup&#xff0c;并在其中包含图片和名称。以下是一个示例代码&#xff1a; 在wxml文件中&#xff0c;添加一个按钮来触发弹出确认popup&#xff1a; <button bindtap"showPopup">显示确…

linux 安装pytorch3d的坑

事实上&#xff0c;只要按照官方文档的说明就可以完美安装。其中坑的地方在于conda的管理可能会导致下载的版本不符合你的要求&#xff08;例如下载成了cpu版本、下载的cuda版本&#xff09;而同样尝试使用源码编译以及其他方式下载库都会导致同样的问题&#xff0c;这里主要的…

79、如何实现接口幂等性

如何实现接口的幂等性 唯一id。每次操作&#xff0c;都根据操作和内容生成唯一的id&#xff0c;在执行之前先判断id是否存在&#xff0c;如果不存在则执行后续操作&#xff0c;并且保存到数据库或者redis等。服务端提供发送token的接口&#xff0c;业务调用接口前先获取token,…

redis基本操作

string数据类型的命令操作 设置键值 使用append 命令设置键值&#xff0c;后面跟键的名字&#xff0c;可以先判断该建是否存在&#xff0c;存在将值追加在后面&#xff0c;不存在自动添加该建 append mykey hello读取键值 get mykey数值类型自减1 数值类型自加1 查看值的…

每天一道C语言编程练习(5):尼科彻斯定理

题目描述 验证尼科彻斯定理&#xff0c;即&#xff1a;任何一个整数m的立方都可以写成m个连续奇数之和。 输入格式 任一正整数 输出格式 该数的立方分解为一串连续奇数的和 样例输入 13 样例输出 13*13*132197157159161163165167169171173175177179181 代码如下&#…

spring boot面向切面编程aop

一、什么是AOP AOP&#xff0c;Aspect Oriented Programming&#xff0c;面向切面编程 举个例子来理解 如果我们的业务需要额外做三件事情&#xff0c;判断是否已经登录&#xff0c;记录日志&#xff0c;统计业务执行时长 传统的做法是这样子的&#xff1a; 而apo的实现是这…

【PHP面试题74】PHP有哪些魔术方法,如何使用他们?

文章目录 一、前言二、模式方法讲解2.1 __construct()2.2 __destruct()2.3 __get()和__set()2.4 __call()和__callStatic()2.5 __toString()2.6 __invoke() 三、总结 一、前言 本文已收录于PHP全栈系列专栏&#xff1a;PHP面试专区。 计划将全覆盖PHP开发领域所有的面试题&…

用于验证 JSON 数据是否符合指定 JSON Schema 的函数,并使用断言进行验证结果

PYTHON 用于验证 JSON 数据是否符合指定 JSON Schema 的函数&#xff0c;并使用断言进行验证结果 from jsonschema import validate, draft7_format_checker, SchemaError, ValidationErrordef jsonschema_assert(code, msg, schema, jsonSchema):assert code codeassert msg…

资深测试总结,自动化测试-JSON+YAML+CSV+Excel数据驱动(详细)

目录&#xff1a;导读 前言一、Python编程入门到精通二、接口自动化项目实战三、Web自动化项目实战四、App自动化项目实战五、一线大厂简历六、测试开发DevOps体系七、常用自动化测试工具八、JMeter性能测试九、总结&#xff08;尾部小惊喜&#xff09; 前言 数据驱动 在自动…

【Linux】udp服务器实现大型网络聊天室

udp终结篇~ 文章目录 前言一、udp服务器实现大型网络聊天室总结 前言 根据上一篇文章中对于英汉互译和远程操作的两个小功能大家应该已经学会了&#xff0c;我们的目的是让大家可以深刻的理解udp服务器所需要的接口已经实现的简单步骤&#xff0c;下面我们开始实现网络聊天室。…

微信小程序custom-tab-bar

微信小程序自定义tab-bar。 tab-bar使用tdesign中的t-tab-bar 1 在项目下新建custom-tab-bar文件夹&#xff0c;新建index 组件。 1.1 index.wxml中增加t-tab-bar <t-tab-bar value"{{value}}" bindchange"onChange" theme"tag" split&…