npm打包并复制文件到根目录

这个需求背景是 因为做一个平台系统 (公众号H5部分的)
平台配置了X个商家,在配置商家时有微信公众号以及支付,
配置域名是需要吧XXX.txt文件配置在根目录 提供域名www.aaa.com/xxx.txt直接访问
实现如下:
每次打包自动把public 下的MPXXX复制到 dist/build/h5 目录下 因为你每次打包都会重置这个目录 所以就有了上述需求

ps:哪些需要在index.html 引用了某些资源文件 如cs 或js报 404 nofound 这个错误的同样适用。
在这里插入图片描述
如下 是实现 方式
本人使用npm方式 --》

npm install  copy-webpack-plugin --save

在根目录配置 vue.config.js

在这里插入图片描述

vue.config.js 内容如下

const CopyWebpackPlugin = require('copy-webpack-plugin')

module.exports = {
	 configureWebpack: {
	plugins: [
		new CopyWebpackPlugin([{
			//复制的源文件位置
			from: './public/MP_verify_d2w0uvCs5w1XCcC5.txt',
			to: ''  
			//复制后目标的位置 默认是打包后的根目录我这里忽略不写
		}]),
	],
	}
};

参考参数

from  定义要拷贝的源文件            from:__dirname+'/src/components'
to      定义要拷贝到的目标文件夹  to: __dirname+'/dist'
toType  file 或者 dir                        可选,默认是文件
force   强制覆盖前面的插件            可选,默认是文件
context                                            可选,默认base   context可用specific  context
flatten  只拷贝指定的文件               可以用模糊匹配
ignore  忽略拷贝指定的文件            可以模糊匹配

–end–

  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
1.项目代码功能经验证ok,确保稳定可靠运行。欢迎下载使用! 2.主要针对各个计算机相关专业,包括计科、信息安全、数据科学与大数据技术、人工智能、通信、物联网等领域的在校学生、专业教师或企业员工使用。 3.项目具有丰富的拓展空间,不仅可作为入门进阶,也可直接作为毕设、课程设计、大作业、初期项目立项演示等用途。 4.当然也鼓励大家基于此进行二次开发。在使用过程中,如有问题或建议,请及时私信沟通。 5.期待你能在项目中找到乐趣和灵感,也欢迎你的分享和反馈! 【资源说明】 基于Nodejs+Vue+Mysql开发前后端分离的图书信息管理系统源码+运行说明(毕业设计项目).zip 使用步骤: 本地运行方法 1.新建一个名为books_manage_system的数据库 2.将node目录下books_manage_system.sql文件导入到该数据库中, 3.在node/sql/booksystem.js文件内根据自己的数据库情况进行修改 4.运行后台 5.运行前台 6.打开提示的网址既可运行 7.如需通过ip地址访问,请在vue.config.js文件中修改配置 打包运行,及线上运行方法: 1.将根目录下books_manage_system.sql文件导入到数据库中 2.在node/sql/booksystem.js文件内根据自己的数据库情况进行修改 3.在books文件夹和node文件夹下分别执行npm install安装插件 4.注释掉books/src/network/request.js文件中的第4行代码 5.在books文件夹下执行npm run build打包前端文件打包完成后将该目录新增的dist文件复制到node文件夹中 6.打包完成后将dist文件复制到node文件夹下 7.将node文件夹下baseURL.js文件中的ip地址,修改为自己电脑的IP,否则线上运行时,会导致部分图片无法访问 8.在node文件夹下执行node index.js 9.之后在处于同一网络中的设备下,输入ip及端口号即可访问页面
【资源说明】 该项目是个人毕设项目源码,评审分达到95分,都经过严格调试,确保可以运行!放心下载使用。 该项目资源主要针对计算机、自动化等相关专业的学生或从业者下载使用,也可作为期末课程设计、课程大作业、毕业设计等。 具有较高的学习借鉴价值!基础能力强的可以在此基础上修改调整,以实现类似其他功能。 基于vue2+Mysql+nodejs+express+element-ui的前后端分离图书管理系统 使用步骤: 本地运行方法  1.新建一个名为books_manage_system的数据库  2.将node目录下books_manage_system.sql文件导入到该数据库中,  3.在node/sql/booksystem.js文件内根据自己的数据库情况进行修改  4.运行后台  5.运行前台  6.打开提示的网址既可运行  7.如需通过ip地址访问,请在vue.config.js文件中修改配置 打包运行,及线上运行方法:  1.将根目录下books_manage_system.sql文件导入到数据库中  2.在node/sql/booksystem.js文件内根据自己的数据库情况进行修改  3.在books文件夹和node文件夹下分别执行npm install安装插件  4.注释掉books/src/network/request.js文件中的第4行代码  5.在books文件夹下执行npm run build打包前端文件打包完成后将该目录新增的dist文件复制到node文件夹中  6.打包完成后将dist文件复制到node文件夹下  7.将node文件夹下baseURL.js文件中的ip地址,修改为自己电脑的IP,否则线上运行时,会导致部分图片无法访问  8.在node文件夹下执行node index.js  9.之后在处于同一网络中的设备下,输入ip及端口号即可访问页面

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值