Gentelella 开源项目使用教程

最新推荐文章于 2024-08-24 08:51:34 发布

咎宁准Karena

最新推荐文章于 2024-08-24 08:51:34 发布

阅读量282

点赞数 3

本文链接：https://blog.csdn.net/gitblog_00456/article/details/141047759

版权

Gentelella 开源项目使用教程

gentelellaFree Bootstrap 4 Admin Dashboard Template项目地址:https://gitcode.com/gh_mirrors/ge/gentelella

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

Gentelella 项目的目录结构如下：

gentelella/
├── build/
├── dist/
├── docs/
├── src/
│   ├── css/
│   ├── fonts/
│   ├── images/
│   ├── js/
│   ├── less/
│   ├── scss/
│   ├── vendors/
│   └── production/
├── CHANGELOG.md
├── CONTRIBUTING.md
├── LICENSE
├── README.md
└── package.json

目录介绍：

build/: 包含构建脚本和配置文件。
dist/: 包含构建后的生产文件。
docs/: 包含项目文档。
src/: 源代码目录，包含 CSS、字体、图片、JavaScript、LESS、SCSS 和第三方库等。
- css/: 自定义 CSS 文件。
- fonts/: 字体文件。
- images/: 图片文件。
- js/: 自定义 JavaScript 文件。
- less/: LESS 样式文件。
- scss/: SCSS 样式文件。
- vendors/: 第三方库文件。
- production/: 生产环境文件。
CHANGELOG.md: 项目更新日志。
CONTRIBUTING.md: 贡献指南。
LICENSE: 项目许可证。
README.md: 项目介绍和使用说明。
package.json: 项目依赖和脚本配置。

2. 项目的启动文件介绍

Gentelella 项目的启动文件主要是 index.html，位于 src/production/ 目录下。这个文件包含了项目的 HTML 结构和基本的页面布局。

启动文件内容概览：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Gentelella Alela! | </title>
    <!-- 引入 CSS 文件 -->
    <link href="vendors/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="vendors/font-awesome/css/font-awesome.min.css" rel="stylesheet">
    <link href="vendors/nprogress/nprogress.css" rel="stylesheet">
    <link href="vendors/animate.css/animate.min.css" rel="stylesheet">
    <link href="build/css/custom.min.css" rel="stylesheet">
</head>
<body class="nav-md">
    <div class="container body">
        <div class="main_container">
            <!-- 页面内容 -->
        </div>
    </div>
    <!-- 引入 JavaScript 文件 -->
    <script src="vendors/jquery/dist/jquery.min.js"></script>
    <script src="vendors/bootstrap/dist/js/bootstrap.min.js"></script>
    <script src="vendors/fastclick/lib/fastclick.js"></script>
    <script src="vendors/nprogress/nprogress.js"></script>
    <script src="vendors/jquery-sparkline/dist/jquery.sparkline.min.js"></script>
    <script src="vendors/moment/min/moment.min.js"></script>
    <script src="vendors/jquery-knob/dist/jquery.knob.min.js"></script>
    <script src="vendors/bootstrap-daterangepicker/daterangepicker.js"></script>
    <script src="build/js/custom.min.js"></script>
</body>
</html>

3. 项目的配置文件介绍

Gentelella 项目的主要配置文件是 package.json，位于项目根目录下。这个文件包含了项目的依赖、脚本和其他配置信息。

配置文件内容概览：

{
  "name": "gentelella",
  "version": "1.4.0",

gentelellaFree Bootstrap 4 Admin Dashboard Template项目地址:https://gitcode.com/gh_mirrors/ge/gentelella

咎宁准Karena

关注

3
点赞
踩
8

收藏

觉得还不错? 一键收藏
打赏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫