pages boilerplate

页面样板

搭建您精彩的静态网站总是令人愉快的。

入门

 # clone repo
$ git clone https://github.com/zce/pages-boilerplate.git my-awesome-pages
$ cd my-awesome-pages
# install dependencies
$ yarn # or npm install 

用法

$ yarn < task > [options]

例如

 # Runs the app in development mode
$ yarn serve --port 5210 --open
# Builds the app for production to the `dist` folder
$ yarn build --production

可用脚本

yarn lint或npm run lint

检查样式和脚本文件。

yarn compile或npm run compile

编译样式、脚本和页面文件。

yarn serve或npm run serve

使用自动化服务器在开发模式下运行应用程序。

选项

• open ：启动时打开浏览器，默认值： false
• port ：指定服务器端口，默认： 2080

yarn build或npm run build

将用于生产的应用程序构建到dist文件夹中。它在生产模式下最小化源以获得最佳性能。

选项

• production : 生产模式标志，默认值： false
• prod ： production的别名

yarn start或npm run start

在生产模式下运行项目。

选项

• open ：启动时打开浏览器，默认值： false
• port ：指定服务器端口，默认： 2080

yarn deploy或npm run deploy

将dist文件夹部署到 GitHub Pages。

选项

• branch ：您要推送到的分支的名称，默认值： 'gh-pages'

yarn clean或npm run clean

清理dist和temp文件。

文件夹结构

 └── my-awesome-pages ································· project root
   ├─ public ········································· static folder
   │  └─ favicon.ico ································· static file (unprocessed)
   ├─ src ············································ source folder
   │  ├─ assets ······································ assets folder
   │  │  ├─ fonts ···································· fonts folder
   │  │  │  └─ pages.ttf ····························· font file (imagemin)
   │  │  ├─ images ··································· images folder
   │  │  │  └─ logo.png ······························ image file (imagemin)
   │  │  ├─ scripts ·································· scripts folder
   │  │  │  └─ main.js ······························· script file (babel / uglify)
   │  │  └─ styles ··································· styles folder
   │  │     ├─ _variables.scss ······················· partial sass file (dont output)
   │  │     └─ main.scss ····························· entry scss file (scss / postcss)
   │  ├─ layouts ····································· layouts folder
   │  │  └─ basic.html ······························· layout file (dont output)
   │  ├─ partials ···································· partials folder
   │  │  └─ header.html ······························ partial file (dont output)
   │  ├─ about.html ·································· page file (use layout & partials)
   │  └─ index.html ·································· page file (use layout & partials)
   ├─ .csscomb.json ·································· csscomb config file
   ├─ .editorconfig ·································· editor config file
   ├─ .gitignore ····································· git ignore file
   ├─ .travis.yml ···································· travis ci config file
   ├─ CHANGELOG.md ··································· repo changelog
   ├─ LICENSE ········································ repo license
   ├─ README.md ······································ repo readme
   ├─ gulpfile.js ···································· gulp tasks file
   ├─ package.json ··································· package file
   └─ yarn.lock ······································ yarn lock file

有关的

• zce/x-pages - 用于静态页面站点的完全托管的 gulp 工作流程。

贡献

1. 在 GitHub 上分叉它！
2. 将 fork克隆到您自己的机器上。
3. 检查你的功能分支： git checkout -b my-awesome-feature
4. 将更改提交到您自己的分支： git commit -am 'Add some feature'
5. 将你的工作推回你的分支： git push -u origin my-awesome-feature
6. 提交拉取请求，以便我们审核您的更改。

注意：在发出拉取请求之前，请务必合并来自“上游”的最新内容！

执照

麻省理工学院 © 汪磊