介绍
generator-angularjs-skeleton 是一个生成基础的 AngularJS 项目骨架的 Yeoman Generator。它提供了一套默认的文件结构，组织代码、模板、样式和资源，以及一些可选的工具和包，使得快速开发新项目变得方便快捷。
为什么使用 generator-angularjs-skeleton？
使用 generator-angularjs-skeleton 可以帮助你：
- 快速创建已经优化的 AngularJS 项目骨架；
- 自定义项目结构，便于维护和开发；
- 自动化工作流，包括自动运行测试、打包文件，优化性能等等；
- 集成了 Bootstrap 和 Font Awesome，加速开发过程；
- 支持多种包管理器，包括 npm、Bower、Yarn 等等。
安装 generator-angularjs-skeleton
确保你已经安装了最新版本的 npm 和 Yeoman，执行命令：
npm install -g yo // yo 命令行工具 npm install -g generator-angularjs-skeleton // 安装 generator-angularjs-skeleton
使用 generator-angularjs-skeleton
在项目目录下，执行命令：
yo angularjs-skeleton
然后根据提示，依次输入项目名称、描述等信息。执行完毕之后，生成的 AngularJS 项目基础骨架已经创建好了。使用 npm run start 或 npm start 命令启动开发服务器。
自定义项目配置
目录结构
generator-angularjs-skeleton 默认提供了一个简单明了的目录结构，并将相关文件分类放置。
-- -------------------- ---- -------
-------
--- -------------
--- ----------
--- ---------
--- ---------
--- ------------
--- ----------
--- -----------
--- -------------
--- ------------------
--- ---------
--- ----
- --- -------
- - --- -------
- - --- ------
- - --- -----
- --- -----------
- - --- -------
- - - --- -------------------
- - - --- -----------
- - - --- -----------
- - --- -------
- - --- -------------------
- - --- -----------
- - --- -----------
- --- -------
- - --- -----------
- - --- -----------
- --- ------
- - --- -----
- - - --- -------
- - - --- ------------------
- - - --- ---------
- - - --- ---------
- - - --- ------------
- - --- ------
- - --- --------
- - --- -------------------
- - --- ----------
- - --- ----------
- - --- -------------
- --- ---------
- - --- ---------------
- - --- --------------------
- --- ------
- --- ----------
--- ------
--- ----
- --- -----------
- --- ------------
--- -----
- --- -----------
- - --- ------------------------
- - --- ------------------------
- --- --------------
- --- ------
- - --- -----------------------
- - --- ------------------------
- --- ---------
- --- --------------------
--- ---------app目录下包含了所有的应用代码，包括组件、页面、服务等等；app/assets目录包含了应用使用到的静态资源，例如图片、字体、图标等；tests目录包含了所有的测试代码，包括单元测试和端到端测试。
你可以根据项目需求自由修改目录结构。
设置默认选项
generator-angularjs-skeleton 的默认设置可能并不完全适合你的项目需求，但想要手动输入每次运行生成器都需要输入的选项也不是太好的选择。
一个更好的方式是在 ~/.yo-rc.json 或者项目的根目录下的 .yo-rc.json 文件中定义默认选项。
-- -------------------- ---- -------
-
------------------------------- -
---------- ---------------
----------------- ----- -- -- ------- -----
------------ ----- -----
--------- ---------------------
------------ -----
-------------- ----
-
-这样，运行 yo angularjs-skeleton 命令时会自动填充默认选项。
集成 Bootstrap 和 Font Awesome
generator-angularjs-skeleton 默认集成了 Bootstrap 和 Font Awesome。这意味着你可以在项目中轻松使用 Bootstrap 的组件和和 Font Awesome 的图标。
通过以下方式创建带有 Bootstrap 和 Font Awesome 的按钮：
<button class="btn btn-primary"> <i class="fa fa-user"></i> Login </button>
打包和部署
generator-angularjs-skeleton 内建了 Gulp 和任务，从而可以非常容易地打包应用代码，并实现增量构建。
在项目目录下执行命令：
npm run build
这个命令将会在 dist 目录下打包构建出生产环境的应用。你也可以通过执行 npm start，启动开发服务器并实时构建应用，使用构建结果进行实时预览。
部署时，你可以将 dist 目录下的内容直接拷贝到 Web 服务器上运行。
总结
generator-angularjs-skeleton 是一个灵活、高效的 AngularJS 项目骨架生成器。它提供了一个完善的文件结构和开发流程，究竟能帮助开发者节约大量时间和精力。如果你正在寻找一种高效的 AngularJS 开发方式，赶快来尝试 generator-angularjs-skeleton 命令吧！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055ead81e8991b448dc296