npm 包 gulp-gh-pages 使用教程

介绍

gulp-gh-pages 是一个方便的 npm 包，可以帮助前端开发者将静态网站发布到 GitHub Pages 上。它基于 Gulp 构建工具，使用简单，功能强大。

安装

在项目目录下运行以下命令进行安装：

npm install --save-dev gulp gulp-gh-pages

使用方法

1. 修改配置

在项目根目录下创建 gulpfile.js 文件，然后添加以下代码：

const gulp = require('gulp');
const ghPages = require('gulp-gh-pages');

gulp.task('deploy', function() {
  return gulp.src('./dist/**/*')
    .pipe(ghPages());
});

其中，./dist/**/* 表示需要发布到 GitHub Pages 上的文件夹路径。你需要将其替换为你项目中实际的文件夹路径。

2. 发布到 GitHub Pages

在终端中执行以下命令即可将网站发布到 GitHub Pages 上：

gulp deploy

之后，你就可以通过访问 https://<username>.github.io/<repo-name>/ 来访问你的网站了。

示例代码

下面是一个示例项目的目录结构：

project/
├── dist/
│   ├── index.html
│   ├── css/
│   │   └── main.css
│   └── js/
│       └── main.js
└── gulpfile.js

在这个示例中，我们使用 gulp-gh-pages 将 dist/ 目录下的文件发布到 GitHub Pages 上。

总结

通过本文的介绍，你已经了解了如何使用 gulp-gh-pages 将静态网站发布到 GitHub Pages 上。同时，你也可以发现，这个 npm 包非常方便，可以帮助开发者快速完成网站发布的过程。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/45993