前端开发中使用 Vue.js 已经越来越普及，因而生成器(generator)与脚手架(scaffold)的使用也变得更加常见。其中，generator-vue-manager 是一款值得一试的工具，它可以帮助我们快速地创建 Vue.js 项目管理系统。
什么是 generator-vue-manager？
generator-vue-manager 是一个基于 Vue.js 的前端项目管理系统生成器，它集成了多个常用的前端工具和组件库，可以帮助我们快速搭建出一套完整的项目管理系统。通过该工具，我们可以轻松创建自己的前端管理系统，其中包含了很多级别的菜单和面包屑导航等功能。此外，generator-vue-manager 还提供了多个模块，例如用户管理模块、角色管理模块、资源管理模块等等，以方便我们进行快速开发。
如何使用 generator-vue-manager？
安装 generator-vue-manager
第一步是安装 generator-vue-manager，你可以使用以下命令全局安装：
npm i -g generator-vue-manager
创建一个新项目
创建一个新项目只需要在终端中输入以下命令：
yo vue-manager
这会创建一个新的项目，并使用 npm 安装依赖。
运行项目
使用命令启动项目：
npm start
使用浏览器打开：http://localhost:8080，你应该可以看到一个欢迎页面。接下来，我们可以开始开发我们的项目。
配置你的管理系统
你可以在下面的文件中找到管理系统的配置：
/src/config/index.js
在该文件中，你可以配置菜单、面包屑导航以及其他一些配置。
generator-vue-manager 的指导意义
generator-vue-manager 不仅可以帮助我们快速搭建一个前端管理系统，还能让我们更好地学习和理解 Vue.js。在使用该工具的过程中，我们可以学到很多有用的知识，例如 Vue.js 路由、组件、状态管理等等。同时，generator-vue-manager 也提供了很多实用的组件和模块，使得我们在开发过程中能够更加高效和快捷。
示例代码
下面是一段基于 generator-vue-manager 创建的示例代码：
-- -------------------- ---- -------
----------
---- -----------------------
---- ----- ---
----------- -------------------- -------------------------------- -------------------
-------------
---- ---- ---
---- ---------------------
-----
---- ----------
------
----
----
-----
------ -------------------
------------------
-------------------
------------
-----------------------
-------------------
--------
---- -- ---
----------- ----------------------- --------------- -------------------- -------------- ------------------------------------------
-------
------
------
------
------
-----------
--------
-- -- ------ --
------ - ----- ------ ---- ---- ---------- - ---- -----------------
------ ---------- ---- --------------------------
------ - -------- - ---- -------------
------ ------- -
----- -----------
----------- -
-----
------
----
----
-----------
----------
--
------ -
------ -
-------- -----
------ ---
----- --
--------- ---
------ --
-------------------- ----
----------- -
-
----- -------
----- -------
--
-
----- ------
-
--
-------- -
-
------ -----
---------- -----
---- -----
------ ---
--
-
------ ------
---------- -------
---- -------
------ ---
--
-
------ -----
---------- ------
---- -----
-
-
--
--
-------- -
--------------- -
------------------ ----------
--
-------------------- -
----------------------- ----------
--
----- ---------- -
--- -
----- ---- - ----- ------------ - ----- ---------- --------- ------------- ---
---------- - ----------
---------- - -----------
------------ - ------
- ----- ----- -
-----------------
-
-
--
--------- -
----------------
-
--
---------来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60056ce381e8991b448e6960
