一种前端项目框架生成方法技术领域
本发明涉及项目框架领域，具体涉及一种前端项目框架生成方法。
背景技术
项目的初始框架搭建，需要定义好目录结构，编写程序启动文件、配置文件，启动
调试等工作，而这些工作是每个项目初始都必须要做的。项目的数量越多，花费的时间就越
长。快速开发是每个企业追求的目标，而快速创建项目是其中的一个关键环节。
前端技术发展很快，已不再仅仅局限于页面展示，前端技术引入了更多其他领域
的思想和方法论，从而产生各种框架和新技术，把现有的一些前端新技术整合在一起，让其
为创建项目服务，也是各个企业和开发团队要考虑的问题。
现有技术基本上是通过复制老项目的项目框架进行开发，速度慢，技术落后。其创
建新项目时，首先复制粘贴老项目的目录，然后在其基础上修改项目中的文件，修改完成后
进行新项目的调试，确认没问题之后开始新项目的开发。这种方式的不足之处是：1)速度
慢，要手动进行配置文件的修改，删除不必要的文件等，修改完了还需要调试是否有问题。
2)技术栈得不到更新，沿用老的项目框架导致只能继续使用原有的技术，一些可以提高开
发效率的新技术得不到使用。
发明内容
本发明所要解决的技术问题是提供一种前端项目框架生成方法，通过模板文件生
成新项目所需的文件内容，包括项目启动文件，配置文件等，并且在程序中定义好项目的模
块和目录结构，让开发团队无需再花时间重新定义整理。
为解决上述技术问题，本发明采用的技术方案是：
一种前端项目框架生成方法，包括以下步骤：
步骤1：定义项目模板文件，包括项目的启动文件、初始页面文件、样式文件和配置
文件，且所述模板文件的目录结构已按照模块划分好；
步骤2：定义交互式命令，包括提示用户输入项目名、提示用户输入项目描述、以及
提示用户选择是否需要定制功能；
步骤3：找到存放模板文件的目录，将其中的主程序目录，包括文档、源代码、测试、
配置和服务端复制到目标文件夹，根据用户的输入不同进行不同的处理逻辑，即若判断到
没有选择定制化功能，则只复制基础的项目模板文件，包括文档、源代码和配置目录，反之
不仅会复制基本的项目模板文件，还会复制带有定制化功能的模板文件到目标目录；
步骤4：根据最终选择生成新项目。
进一步的，定义交互式命令包括创建项目的命令，具体为：提示用户输入项目名
称；名称输入完毕后，继续提示用户输入项目描述；描述输入完毕后，提示用户是否需要其
他定制功能；若用户选择是，则生成带有定制功能的项目，若用户选择否，则只生成基础模
块的项目。
进一步的，定义交互式命令包括创建项目单一模块的命令，具体为：提示用户输入
模块的名称；名称输入完成后，继续提示用户该模块是否需要其他定制功能；若选择是，则
生成带有定制功能的模块，若选择否，则只生成带有基础功能的模块。
与现有技术相比，本发明的有益效果是：通过模板文件生成新项目所需的文件内
容，包括项目启动文件，配置文件等，并且在程序中定义好项目的模块和目录结构，让开发
团队无需再花时间重新定义整理，快速搭建前端项目框架，提高效率，节省时间，配置灵活。
附图说明
图1是本发明一种前端项目框架生成方法之目录结构图。
图2是本发明一种前端项目框架生成方法之项目创建流程图。
图3是本发明一种前端项目框架生成方法之创建项目交互式命令流程图。
图4是本发明一种前端项目框架生成方法之创建模块交互式命令流程图。
具体实施方式
下面结合附图和具体实施方式对本发明作进一步详细的说明。本发明的前端表示
网站的前台部分，包括网站的表现层和结构层，技术栈表示项目中使用到的各种技术，工具
和框架的统称。
本发明一种前端项目框架生成方法，在创建项目的过程中，让开发团队自定义地
选择新项目要包含哪些模块，一些不需要的项目模块可以不在新项目中创建，从而达到定
制化创建新项目的目的。整合了现有前端的前沿技术，包括页面渲染技术，文件构建技术，
页面数据状态管理技术等，这样使得创建出来的新项目可以很方便的为开发团队服务，提
高团队的开发效率。而且整合的技术栈不是一成不变，而是通过技术发展随时进行更新，这
样就不用担心技术栈得不到更新的问题。
详述如下：
1)项目模板文件
自动化创建项目的方法需要先定义一套项目模板文件，这些文件包括项目的启动
文件，初始页面文件和样式文件，配置文件等，并且这些模板文件的目录结构已按照模块划
分好了，方便开发团队快速熟悉项目框架。目录结构如图1所示。在图1中，src目录是项目源
代码目录，下面有components，containers，constants，utils等目录，这些目录是按模块定
义好的目录结构，webpack目录是存放配置文件的地方，另外还有其他一些项目文件。
2)项目创建程序
项目创建分2个部分，一个是项目整体框架的创建，一个是项目单个模块的创建。
项目创建流程如图2所示，包括用户执行创建项目的命令、程序将模板文件复制到新项目的
目录、提示用户选择是否需要定制化功能、根据用户选择生成新项目。
首先定义3个交互式命令，分别是提示用户输入项目名、提示用户输入项目描述以
及提示用户选择是否需要定制功能。
然后是复制程序模板框架的功能，先找到存放模板文件的目录，然后将其中的主
程序目录，包括文档、源代码、测试、配置和服务端复制到目标文件夹，其中根据用户的输入
不同而有不同的处理逻辑。如果判断到用户没有选择了定制化功能，则程序只复制文档、源
代码和配置目录的项目模板文件(基本的项目模板文件)，反之程序不仅会复制基本项目文
件，还会复制带有定制化功能的模板文件到目标目录。
程序在执行复制文件的过程中，不是单纯的原封不动的拷贝文件，而是会在模板
文件的基础上，动态生成具体的项目文件，然后再将文件拷贝到目标目录。比如，有一个项
目模板文件叫package.json，里面的内容为："name":"<％＝projectName％>"，程序在执行
的过程中，会将该文件动态生成为："name":"my app"，然后再将该文件复制到目标目录。
3)交互式命令
在用户创建项目的过程中，会提示用户做一些命名上的交互，包括输入项目名称，
项目描述，选择特定的功能等。
(1)创建项目的交互式命令流程如图3所示：包括用户执行创建项目的命令、程序
提示用户输入项目名称、名称输入完毕后程序继续提示用户输入项目描述、描述输入完毕
后程序提示用户是否需要其他定制功能、如果用户输入“是”，则生成带有其他定制功能的
项目、如果用户输入“否”，则只生成基础模块的项目，最后创建项目成功。
(2)创建项目模块的交互式流程如图4所示：包括用户执行创建项目单一模块的命
令、程序提示用户输入模块的名称、名称输入完成后程序继续提示用户该模块是否需要其
他定制功能、如果用户选择是，则程序生成带有定制功能的模块、如果用户选择否，则程序
只生成带有基础功能的模块。