Jade HTML5 Boilerplate 项目教程

Jade HTML5 Boilerplate 项目教程

jade-html5-boilerplate HTML5 Boilerplate ported to Jade. Great as a drop and go markup skeleton for Express apps. 项目地址: https://gitcode.com/gh_mirrors/ja/jade-html5-boilerplate

1. 项目的目录结构及介绍

jade-html5-boilerplate/
├── Gruntfile.js
├── LICENSE
├── README.md
├── app
│   ├── css
│   │   └── main.css
│   ├── img
│   ├── js
│   │   └── main.js
│   └── templates
│       └── index.jade
├── bower.json
├── package.json
└── public
    ├── css
    │   └── main.css
    ├── img
    ├── js
    │   └── main.js
    └── index.html

• Gruntfile.js: Grunt 任务配置文件，用于自动化构建任务。
• LICENSE: 项目许可证文件。
• README.md: 项目说明文件。
• app/: 源代码目录，包含 Jade 模板、CSS、JavaScript 和图片资源。
  • css/: 存放 CSS 文件。
  • img/: 存放图片资源。
  • js/: 存放 JavaScript 文件。
  • templates/: 存放 Jade 模板文件。
• bower.json: Bower 依赖管理文件。
• package.json: npm 依赖管理文件。
• public/: 构建后的静态资源目录，包含 HTML、CSS、JavaScript 和图片资源。
  • css/: 存放构建后的 CSS 文件。
  • img/: 存放构建后的图片资源。
  • js/: 存放构建后的 JavaScript 文件。
  • index.html: 构建后的 HTML 文件。

2. 项目的启动文件介绍

• Gruntfile.js: 这是项目的启动文件之一，用于配置和运行 Grunt 任务。Grunt 是一个 JavaScript 任务运行器，可以自动化构建、测试和部署任务。通过运行 grunt 命令，可以启动项目的构建过程。

3. 项目的配置文件介绍

• package.json: 这是 npm 的配置文件，包含了项目的依赖包信息和脚本命令。通过 npm install 命令可以安装项目所需的所有依赖包。
• bower.json: 这是 Bower 的配置文件，用于管理前端依赖包。通过 bower install 命令可以安装项目所需的前端依赖包。
• Gruntfile.js: 这是 Grunt 的配置文件，定义了项目的构建任务。通过 grunt 命令可以运行这些任务，例如编译 Jade 模板、压缩 CSS 和 JavaScript 文件等。

jade-html5-boilerplate HTML5 Boilerplate ported to Jade. Great as a drop and go markup skeleton for Express apps. 项目地址: https://gitcode.com/gh_mirrors/ja/jade-html5-boilerplate