百度360必应搜狗淘宝本站头条
linux文件压缩linux用户组查看linux磁盘mysql安装linuxlinux多线程
当前位置：网站首页 > 优雅编程 > 正文

前端可视化平台（什么叫前端可视化）

sinye56 2024-10-25 16:14 4 浏览 0 评论

前端可视化平台

使用electron+node+react开发的前端可视化项目管理工具

开发起因

随着前端项目的开发,前端项目就会越来越多,比如小程序,pc端,移动端h5项目已经微前端的项目,公司的还有自己的,那么每次打开自己项目文件夹就会出现以下情况:

如上图所示,就会存在一下问题:

项目数量庞大,项目查找较麻烦项目启动繁琐,需要频繁切换到对应文件下进行运行无法快捷找到对应文件夹进行指令执行无法快速进行多个项目启动

? 所以,我就想着能否开发出一个能够方便自己的开发工具,期望能做到以下功能

能够动态获取项目指令并批量执行能够动态管控和查询对应项目能够快捷打开项目和对应文件夹路径文件打包完成后将打包文件放入指定文件下最好能够支持浏览器插件进行对应功能调用

#技术选型

? 由于项目启动和打包都是基于node环境,所以我最先选择的是node.js进行全局包工具开发(xl-order (opens new window)),设想为将多个指令保存并在调用时进行批量执行,比如我可以将

nginx -c /etc/nginx/nginx.conf && nginx -s reload

1

视为一个指令并为其规定一个调用别称,这样我可以通过调用别称直接进行对应代码的执行,减少每次都需要重复输入大量代码.

优点:

解决了每次都需要进入对应项目的痛点解决了多个指令执行时需要本人时常关注执行的问题部分解决了快捷启动对应项目等

缺点:

每次执行都需要打开一个cmd非可视化界面,交互局限较大无法快捷打开对应文件夹无法提供一些开发小工具等

结论:

? 该工具较适合在服务器环境上进行操作,可对执行指令进行压缩,不需要多次输入冗余指令,如果大家觉得有兴趣可使用xl-order (opens new window),源码后续优化后就会放出

? 随着node插件开完告一段落,我发现这个工具虽然能用,但局限还是太大

达不到我心里的预期,且页达不到浏览器插件调用功能的预期,所以我将目光看向了electron,electron提供了node环境+系统文件等功能+浏览器环境的功能,那么,以上的问题理论上就可以通过electron解决,而且浏览器插件调用本地功能也成为可能,原因是node本身是可以启动一个服务器端口,那么其他软件如果需要调用功能,只需调用对应接口即可.

? 说干就干,随着我几个月的奋斗,前端可视化平台(WEBPCILVDS),和对应浏览器插件完成了第一版开发

#软件功能简述

? 本软件提供可视化管理前端项目,提供指定执行项目指令执行额外执行指定逻辑,提供浏览器插件,支持通过浏览器插件进行软件项目管理模块的调用

并提供一些前端实用小工具,方便开发。



开源地址：https://github.com/424490034/pci-docs

相关推荐

Linux在线安装JDK1.8

首先在服务器pingwww.baidu.com查看是否可以连网然后就可以在线下载一、下载安装JDK1.81、在下载安装的同时做好一些准备工作...

Linux安装JDK，超详细

1、了解RPMRPM是Red-HatPackageManager（RPM软件包管理器）的缩写，这一文件格式名称虽然打上了RedHat的标志，但是其原始设计理念是开放式的，现在包括OpenLinux...

Linux安装jdk1.8(超级详细)

前言最近刚购买了一台阿里云的服务器准备要搭建一个网站，正好将网站的一个完整搭建过程分享给大家！#一、下载jdk1.8首先我们需要去下载linux版本的jdk1.8安装包，我们有两种方式去下载安装...

Linux系统安装JDK教程

下载jdk-8u151-linux-x64.tar.gz下载地址：https://www.oracle.com/technetwork/java/javase/downloads/index.ht...

干货|JDK下载安装与环境变量配置图文教程「超详细」

1.JDK介绍1.1什么是JDK?SUN公司提供了一套Java开发环境，简称JDK(JavaDevelopmentKit)，它是整个Java的核心，其中包括Java编译器、Java运行工具、Jav...

Linux下安装jdk1.8

一、安装环境操作系统：CentOSLinuxrelease7.6.1810(Core)JDK版本：1.8二、安装步骤1.下载安装包...

Linux上安装JDK

以CentOS为例。检查是否已安装过jdk。yumlist--installed|grepjdk或者...

Linux系统的一些常用目录以及介绍

根目录（／）：“／”目录也称为根目录，位于Linux文件系统目录结构的顶层。在很多系统中，“／”目录是系统中的唯一分区。如果还有其他分区，必须挂载到“／”目录下某个位置。整个目录结构呈树形结构，因此也...

Linux系统目录结构

一、系统目录结构几乎所有的计算机操作系统都是使用目录结构组织文件。具体来说就是在一个目录中存放子目录和文件，而在子目录中又会进一步存放子目录和文件，以此类推形成一个树状的文件结构，由于其结构很像一棵树...

Linux文件查找

在Linux下通常find不很常用的，因为速度慢（find是直接查找硬盘），通常我们都是先使用whereis或者是locate来检查，如果真的找不到了，才以find来搜寻。为什么...

嵌入式linux基本操作之查找文件

对于很多初学者来说都习惯用windows操作系统，对于这个系统来说查找一个文件简直不在话下。而学习嵌入式开发行业之后，发现所用到的是嵌入式Linux操作系统，本想着跟windows类似，结果在操作的时...

linux系统查看软件安装目录的方法

linux系统下怎么查看软件安装的目录？方法1：whereis软件名以查询nginx为例子...

Linux下如何对目录中的文件进行统计

统计目录中的文件数量...

Linux常见文件目录管理命令

touch用于创建空白文件touch文件名称mkdir用于创建空白目录还可以通过参数-p创建递归的目录...

Linux常用查找文件方法总结

一、前言Linux系统提供了多种查找文件的命令，而且每种查找命令都具有其独特的优势，下面详细总结一下常用的几个Linux查找命令。二、which命令查找类型：二进制文件；...

取消回复欢迎 你 发表评论:

一周热门
最近发表
标签列表