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…

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

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

基于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 一、系统介绍 本项目有网页版和小程序端 本系统分为管理员、医生、用户三种角色 用户角色包含以下功能: 登录、注册、宠物领养、医生在线咨询、查看挂号、个人中心、密码修改、宠物寄…

linux 安装pytorch3d的坑

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

redis基本操作

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

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

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

spring boot面向切面编程aop

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

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

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

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

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

STM32单片机语音识别台灯控制系统人检测亮度调节

实践制作DIY- GC00156-语音识别台灯控制系统 一、功能说明: 基于STM32单片机设计-语音识别台灯控制系统 二、功能说明: 电路:STM32F103C系列最小系统串口语音识别模块LED灯板1个红外传感器 1.任何时候没有人则关闭灯。有人可以自动打开灯。…

Python物联网开发-Python_Socket通信开发-Python与Tcp协议物联网设备通信-Socket客户端

一、前言 Python在物联网开发中的重要愈来愈重,因此,掌握Python语言与物联网设备之间的通信就显得尤为重要,可以通过编写Python程序实现获取物联网设备的传感器数值并可以更改物联网设备上的执行器状态。 二、程序实现 首先,当使…

HarmonyOS学习路之方舟开发框架—学习ArkTS语言(基本语法 一)

初识ArkTS语言 ArkTS是HarmonyOS优选的主力应用开发语言。ArkTS围绕应用开发在TypeScript(简称TS)生态基础上做了进一步扩展,继承了TS的所有特性,是TS的超集。因此,在学习ArkTS语言之前,建议开发者具备TS语…

Linux内核的任务:

硬件与软件之间的中间层:内核在技术层面上充当硬件和软件之间的中间层,负责将应用程序的请求传递给硬件,并处理硬件设备和组件的寻址和操作。 应用程序的接口:对于应用程序来说,内核是它们与硬件之间的接口。应用程序通…

抓 https 报文新方案 -Magisk+LSPosed,来试试吧

关于如何抓取Android端https报文,在之前一篇文章中有介绍可以通过VitualXposedJustTrustMe模块禁用SSL验证,这样可以抓取到https,还是有一些同学反馈以下的一些问题: App在低版本的Android上不兼容,需要用高版本的And…

uniapp 集成七牛云,上传图片

1 创建项目 我是可视化创建项目的 ,cli创建的项目可以直接使用npm安装七牛云。 2 拷贝qiniuUploader.js到项目,下面的回复 放了qiniuUploader.js百度云链接。 3 在需要使用qiniuUploader的vue文件 引入。 4 相册选择照片,或者拍照后&#xff…

视频问答新增或修改视频问答

通过问答id新增或修改视频问答题目 新增或修改视频问答 图3:视频问答功能(观看效果) 图4:视频问答功能(观看效果) 图5:视频问答功能(观看效果) 单元测试 Testpublic voi…

zabbix 6.0 监控LNPM环境

这里的LNPM是指Linux,Nginx,php-fpm和Mysql.具体版本如下。 Linux : centos7.9Nginx: 1.22.1php-fpm:7.4Mysql: 8.0 一、centos7.9 编译安装Nginx 为了弄清楚Nginx各种配置,我们采用编译安装的形式部署Nginx。 1.下载安装包 首先下载Nginx软件包&am…

为什么媒体和创意工作者更喜欢 Splashtop 进行远程访问

在当今快速发展的数字环境中,可靠的远程访问已成为全球媒体和创意工作者不可或缺的工具。 远程访问让创意工作者不再受传统办公空间边界的限制,完全实现了随时随地办公。无论是实时剪辑、高分辨率渲染还是其他创意任务,创意工作者对高性能远…