基于资源能力中心的前端构建方法及系统技术方案

本发明专利技术公开了基于资源能力中心的前端构建方法及系统，属于Vue前端项目构建领域，本发明专利技术要解决的技术问题为如何快速实现零配置原型开发，确保企业内部所有Vue前端项目的标准化，有效提升Vue前端项目的构建速度，采用的技术方案为：该方法具体如下：初始化脚手架框架：创建项目文件夹，并将初始化完成的项目发布的npm使用命令npm publish发布；接收用户输入参数；检查目标路径；拉取远程仓库模板代码：使用download

【技术实现步骤摘要】
基于资源能力中心的前端构建方法及系统


[0001]本专利技术涉及Vue前端项目构建领域，具体地说是一种基于资源能力中心的前端构建方法及系统。

技术介绍

[0002]在Vue前端项目构建领域，使用vue
‑
cli构建的项目，在不同部门之间、不同项目之间各自为战，构建的项目在配置、样式、鉴权、代码风格等方面各不相同。随着构建项目数量急剧增加的情况下，原有vue
‑
cli构建项目，无法应对快速构建、统一配置的业务需要。
[0003]故如何快速实现零配置原型开发，确保企业内部所有Vue前端项目的标准化，有效提升Vue前端项目的构建速度是目前亟待解决的技术问题。

技术实现思路

[0004]本专利技术的技术任务是提供一种基于资源能力中心的前端构建方法及系统，来解决如何快速实现零配置原型开发，确保企业内部所有Vue前端项目的标准化，有效提升Vue前端项目的构建速度的问题。
[0005]本专利技术的技术任务是按以下方式实现的，一种基于资源能力中心的前端构建方法，该方法具体如下：
[0006]初始化脚手架框架：创建项目文件夹，并将初始化完成的项目发布的npm使用命令npm publish发布；
[0007]接收用户输入参数：使用commander.js接收用户输入参数create，添加到init.js文件中，在init.js文件中引入commander的对象Command，并初始化为变量program；调用command方法，创建一个create命令，同时create命令后面必须跟一个命令参数，为该命令指定参数，解析到该指定参数，再根据参数实现对应逻辑；用户输入命令toy
‑
cli create项目名时，调用src\commands.js的内容；
[0008]检查目标路径：使用fs
‑
extra检查当前位置是否已经存在一个同名的文件夹：若是使用inquirer让用户选择，则重新创建一个新的文件夹，覆盖当前文件夹，并退出；并根据用户的不同选择作出不同的操作；
[0009]拉取远程仓库模板代码：使用download
‑
git
‑
repo拉取远程仓库资源能力中心模板代码，该模板代码中统一资源能力中心要求的页面样式、统一鉴权及代码风格的配置；
[0010]更新package.json文件：自动更新package.json中的name、version、及author的属性；
[0011]安装项目依赖：自动安装项目依赖，依赖安装完成后，使用npm run serve启动项目。
[0012]作为优选，初始化脚手架框架具体如下：
[0013]创建项目根文件夹toy
‑
cli并进入该项目根文件夹，在toy
‑
cli文件夹下创建bin和src文件夹；
[0014]在bin下创建init.js作为脚本的入口文件，并在init.js中键入“#！/usr/bin/env node”；
[0015]初始化npm的包管理文件,根目录下执行“npm i”，“npm i”命令会询问配置参数，若不想被询问，则直接在后面加
‑
y参数即可。
[0016]作为优选，接收用户输入参数具体如下：
[0017]调用program的version方法，定义命令行命令版本的功能，在命令行输入toy
‑
v得到当前的版本信息；
[0018]调用program的usage方法，是定义的辅助命令(help)的提示的文案标题，类似于定义table的表头的感觉；
[0019]调用program的option方法，定义命令行参数，比如toy
‑
f，等同于toy
–
force；注意，第一个参数是定义命令行参数，包含一个短的名称(1个字符)和一个长的名称，不能多了；第二个参数，就是定义的说明内容。
[0020]作为优选，检查目标路径具体如下：
[0021]判断用户在输入toy create my
‑
app时是否有在后面加
‑
f的参数：
[0022]若添加参数，则说明忽略检查直接往后走，即默认覆盖的操作；并通过调用fs.removeSync(target)方法进行移除需要覆盖的文件；
[0023]若否，则需要进行文件夹检查的实现逻辑；
[0024]通过fs.pathExistsSync(target)逻辑进行判断当前文件夹名称是否已经存在：
[0025]若不存在，则resolve提供程序执行文件夹检查成功后的程序。
[0026]若同名，则给用户提示，让用户选择操作。
[0027]作为优选，拉取远程仓库模板代码具体如下：
[0028]把资源下载到当前的临时文件夹位置，若临时文件夹已经存在，则先删除临时文件夹；
[0029]使用资源深度拷贝方法，将临时文件夹下下载的资源文件移动到指定的位置；
[0030]移除项目中本身含有的.git及.changelogs的文件，因为这些是该git项目需要的内容，而我们实际是不需要的。
[0031]作为优选，更新package.json文件具体如下：
[0032]获取当前的项目内的package.json文件的相对路径，读取package.json文件内容；
[0033]移除不需要的字段，不需要的字段本身只是git项目配置的内容，而我们业务项目是不需要的；
[0034]合并需要的信息，以初始化的项目名称作为name，author字段更新成git上的name；
[0035]将更新后的package.json数据写入到package.json文件中去。
[0036]更优地，安装项目依赖具体如下：
[0037]使用”npm install”安装依赖，并使用
‑‑
registry指定使用镜像源，或根据用户的选择指定npm、yarn和其他镜像源；
[0038]使用”npm run serve”命名启动项目
[0039]判断项目是否安装成功：
[0040]若项目安装失败，提示用户使用”npm install”命令手动安装依赖。
[0041]一种基于资源能力中心的前端构建系统，该系统包括，
[0042]初始化模块，用于初始化脚手架框架，即创建项目文件夹，并将初始化完成的项目发布的npm使用命令npm publish发布；
[0043]接收模块，用于使用commander.js接收用户输入参数create，添加到init.js文件中，在init.js文件中引入commander的对象Command，并初始化为变量program；调用command方法，创建一个create命令，同时create命令后面必须跟一个命令参数，为该命令指定参数，解本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种基于资源能力中心的前端构建方法，其特征在于，该方法具体如下：初始化脚手架框架：创建项目文件夹，并将初始化完成的项目发布的npm使用命令npm publish发布；接收用户输入参数：使用commander.js接收用户输入参数create，添加到init.js文件中，在init.js文件中引入commander的对象Command，并初始化为变量program；调用command方法，创建一个create命令，同时creat e命令后面必须跟一个命令参数，为该命令指定参数，解析到该指定参数，再根据参数实现对应逻辑；用户输入命令toy
‑
cli create项目名时，调用src\commands.js的内容；检查目标路径：使用fs
‑
extra检查当前位置是否已经存在一个同名的文件夹：若是使用inquirer让用户选择，则重新创建一个新的文件夹，覆盖当前文件夹，并退出；并根据用户的不同选择作出不同的操作；拉取远程仓库模板代码：使用download
‑
git
‑
repo拉取远程仓库资源能力中心模板代码，该模板代码中统一资源能力中心要求的页面样式、统一鉴权及代码风格的配置；更新package.json文件：自动更新package.json中的name、version、及author的属性；安装项目依赖：自动安装项目依赖，依赖安装完成后，使用npm run serve启动项目。2.根据权利要求1所述的基于资源能力中心的前端构建方法，其特征在于，初始化脚手架框架具体如下：创建项目根文件夹toy
‑
cli并进入该项目根文件夹，在toy
‑
cli文件夹下创建bin和src文件夹；在bin下创建init.js作为脚本的入口文件，并在init.js中键入“#！/usr/bin/env node”；初始化npm的包管理文件,根目录下执行“npm i”，“npm i”命令会询问配置参数，若不想被询问，则直接在后面加
‑
y参数即可。3.根据权利要求1所述的基于资源能力中心的前端构建方法，其特征在于，接收用户输入参数具体如下：调用program的version方法，定义命令行命令版本的功能，在命令行输入toy
‑
v得到当前的版本信息；调用program的usage方法，是定义的辅助命令的提示的文案标题；调用program的option方法，定义命令行参数。4.根据权利要求1所述的基于资源能力中心的前端构建方法，其特征在于，检查目标路径具体如下：判断用户在输入toy create my
‑
app时是否有在后面加
‑
f的参数：若添加参数，则说明忽略检查直接往后走，即默认覆盖的操作；并通过调用fs.removeSync(target)方法进行移除需要覆盖的文件；若否，则需要进行文件夹检查的实现逻辑；通过fs.pathExistsSync(target)逻辑进行判断当前文件夹名称是否已经存在：若不存在，则resolve提供程序执行文件夹检查成功后的程序。若同名，则给用户提示，让用户选择操作。5.根据权利要求1所述的基于资源能力中心的前端构建方法...

【专利技术属性】
技术研发人员：吴瑞，宋健，
申请(专利权)人：浪潮通信信息系统有限公司，
类型：发明
国别省市：