gulp打包vue3+jsx+less插件

最终转换结果如下
在这里插入图片描述

在根目录下添加gulpfile.js文件,package.json添加命令npm run gulp

var gulp = require('gulp')
var babel = require('gulp-babel')
var less = require('gulp-less')
var del = require('del');
var spawn = require('child_process').spawn;const outDir = "dist/"function es6toes5() {return gulp.src('packages/**/*.js').pipe(babel({presets: ["@babel/preset-env"],'plugins': [() => {return {visitor: {ImportDeclaration(path, source) {console.log(path);if (path.node.source.value.endsWith('.less')) {path.node.source.value = path.node.source.value.replace(/\.less$/, '.css')}},},}}]})).pipe(gulp.dest(outDir ));
}// function jsxtojs1() {
//   return gulp.src("packages/**/*.jsx").
//     pipe(babel({
//       plugins: [
//         ['@babel/plugin-transform-react-jsx', {
//           "throwIfNamespace": false,
//         }
//         ]
//       ]
//     })).
//     pipe(gulp.dest(outDir ));
// }
function jsxtojs() {return gulp.src("packages/**/*.jsx").pipe(babel({plugins: [['@vue/babel-plugin-jsx',{enableObjectSlots: false,},],],})).pipe(gulp.dest(outDir ));
}function lesstocss() {return gulp.src('packages/**/*.less').pipe(less({relativeUrls: true,})).pipe(gulp.dest(outDir ))
}function npmTask(cb) {spawn('npm.cmd', ['run', 'lib'], {}) // 'npm.cmd' : 'npm' 运行 npm run lib .on('error', cb).on('close', code => code ? cb(new Error(code)) : cb());
}exports.default = gulp.series(() => del([`./${outDir}/**`]),npmTask,jsxtojs,es6toes5,lesstocss);

打包后的结果

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

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

相关文章

【FPGA零基础学习之旅#16】嵌入式块RAM-双口ram的使用

🎉欢迎来到FPGA专栏~双口ram的使用 ☆* o(≧▽≦)o *☆嗨~我是小夏与酒🍹 ✨博客主页:小夏与酒的博客 🎈该系列文章专栏:FPGA学习之旅 文章作者技术和水平有限,如果文中出现错误,希望大家能指正…

X32位汇编和X64位区别无参函数分析(一)

前言 一、X32汇编函数无参无返回分析 二、X64汇编函数无参无返回分析 总结 前言 提示:以下是个人学习总结:如有错误请大神指出来,只供学习参考,本内容使用使用VS2017开发工具:语言是C,需要一些常见的汇编指…

手机知识:安卓内存都卷到24GB了,为何iPhone还在固守8GB

目录 一、系统机制 二、生态差异 三、总结 在刚刚过去的9月,年货iPhone 15系列正式发布,标准版不出意外还是挤药膏,除了镜头、屏幕有些升级,芯片用iPhone 14 Pro系列的,内存只有6GB;即使是集钛合金机身、…

【大数据】Kafka 实战教程(一)

Kafka 实战教程(一) 1.Kafka 介绍1.1. 主要功能1.2. 使用场景1.3 详细介绍1.3.1 消息传输流程1.3.2 Kafka 服务器消息存储策略1.3.3 与生产者的交互1.3.4 与消费者的交互 2.Kafka 生产者3.Kafka 消费者3.1 Kafka 消费模式3.1.1 At-most-once(…

NVIDIA NCCL 源码学习(十一)- ring allreduce

之前的章节里我们看到了nccl send/recv通信的过程,本节我们以ring allreduce为例看下集合通信的过程。整体执行流程和send/recv很像,所以对于相似的流程只做简单介绍,主要介绍ring allreduce自己特有内容。 单机 搜索ring 在nccl初始化的过…

51单片机仿真软件 Proteus 8 Pro 安装步骤

51单片机仿真软件 Proteus 8 Pro 安装步骤 学习 51 单片机的时候,如果手头没有开发板,可以使用仿真软件 Proteus。Proteus 可以仿真 51 单片机及周边元器件(例: LED) 的运行情况。 可以简单认为:Proteus …

经典链表问题:解析链表中的关键挑战

这里写目录标题 公共子节点采用集合或者哈希采用栈拼接两个字符串差和双指针 旋转链表 公共子节点 例如这样一道题:给定两个链表,找出它们的第一个公共节点。 具体的题目描述我们来看看牛客的一道题: 这里我们有四种解决办法: …

pandas写入MySQL

安装好pandas、mysql pip install pandas pip install pymysql 导入pandas、mysql import pymysql as mysql import pandas as pd 建立连接 conmysql.connect(host10.10.0.221,userroot,passwordroot,databasepandas,port3306,charsetutf8) 创建游标 curcon.cursor() 读…

文档的重要性及接口文档模板

随着工作年限的增长,我们逐渐意识到工作中文档的重要性不可忽视。优质的文档不仅能提高工作效率,还能有效降低沟通成本,因此我们必须注重文档的撰写和格式。最近,由于未能及时更新文档,导致在项目开发中出现了信息冲突…

Vue解决 npm -v 报错(一)

报错内容: npm WARN config global --global, --local are deprecated. Use --locationglobal instead. 解决方案: 代码: prefix -g 替换为: prefix --locationglobal 原创作者:吴小糖 创作时间:2023.1…

Android之AMS原理分析

在学习android框架原理过程中,ams的原理非常重要,无论是在面试中还是在自己开发类库过程中都会接触到。 1 简述 ActivityManagerService是Android最核心的服务,负责管理四大组件的启动、切换、调度等工作。由于AMS的功能和重要性&#xff0c…

字符串输入(注意:cin遇到空白字符停止读入)

1.输入多个字符串时,又无法开二维数组; 可动态分配数组(直接声明数组,指向的地址的不变的) while (num--){char* arr (char*)malloc(10000 * sizeof(char));char ch 0;int k 0;while ((ch getchar()) ! \n){arr[k…

文心一言 VS 讯飞星火 VS chatgpt (118)-- 算法导论10.3 3题

三、用go语言,在ALLOCATE-OBJECT和 FREE-OBJECT过程的实现中,为什么不需要设置或重置对象的 prev 属性呢? 文心一言: 在 Go 语言中,ALLOCATE-OBJECT 和 FREE-OBJECT 过程的实现通常不需要显式地设置或重置对象的 prev 属性。这…

【简记】getprop, setprop 命令使用

getprop, setprop 命令使用 1、终端设置、读取系统属性 // 例 adb shell setprop "test" "1" adb shell getprop "test"2、安卓读取系统配置 部分属性需要通过反射 android.os.SystemProperties 的方法获取,参见 android 获取手机…

Java EE-使用Servlet搭建一个简单的前后端交互程序

上述前端和后端的代码如下&#xff1a; 前端&#xff1a; <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta http-equiv"X-UA-Compatible" content"IEedge"><meta name"vie…

LuatOS-SOC接口文档(air780E)--lcd - lcd驱动模块

常量 常量 类型 解释 lcd.font_opposansm8 font 8号字体 lcd.font_unifont_t_symbols font 符号字体 lcd.font_open_iconic_weather_6x_t font 天气字体 lcd.font_opposansm10 font 10号字体 lcd.font_opposansm12 font 12号字体 lcd.font_opposansm16 font…

搭建网站七牛云CDN加速配置

打开七牛云后台&#xff1b;添加域名&#xff1b; 添加需要加速的域名&#xff0c;比如我添加的是motoshare.cn 源站配置&#xff0c;这里要用IP地址&#xff0c;访问的目录下面要有能访问测试的文件&#xff0c;尽量不要用源站域名&#xff0c;这个只能用加速二级域名&#x…

【试题039】 多个逻辑或例题

题目&#xff1a;设int n;,执行表达式(n0)||(n1)||(n2)||(n3)后,n的值是&#xff1f;代码分析&#xff1a; //设int n; , 执行表达式(n 0) || (n 1) ||(n 2) ||(n 3)后, n的值是?int n;printf("n%d\n", (n 0) || (n 1) || (n 2) || (n 3));//分析&#xff1…

树的重心学习

知识&#xff1a; 定义&#xff1a;重心是指树中的一个结点&#xff0c;如果将这个点删除后&#xff0c;剩余各个连通块中点数的最大值最小&#xff0c;那么这个节点被称为树的重心。 &#xff08;最大值的最小值&#xff09; 树的重心的性质&#xff1a; 1.一个树最多只有1个或…

STM32-LTC6804方案成熟BMS方案

方案下载链接&#xff01;&#xff01;https://mp.weixin.qq.com/s?__bizMzU2OTc4ODA4OA&mid2247549092&idx1&snc73855c4e3d5afddd8608d8528864f95&chksmfcfb1373cb8c9a65a4bd1f545a1a587af882f209e7ccbb8944f4d2514d241ca1d7fcc4615e10&token539106225&a…