pages boilerplate

Seiten-Boilerplate

Es ist immer eine Freude, Ihre fantastischen statischen Websites zu erstellen.

Erste Schritte

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

Verwendung

$ yarn < task > [options]

z.B

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

Verfügbare Skripte

yarn lint oder npm run lint

Lintieren Sie die Stil- und Skriptdateien.

yarn compile oder npm run compile

Kompilieren Sie die Stil-, Skript- und Seitendatei.

yarn serve oder npm run serve

Führt die App im Entwicklungsmodus mit einem automatisierten Server aus.

Optionen

• open : Browser beim Start öffnen, Standard: false
• port : Geben Sie den Server-Port an, Standard: 2080

yarn build oder npm run build

Erstellt die App für die Produktion im dist -Ordner. Es minimiert die Quelle im Produktionsmodus, um die beste Leistung zu erzielen.

Optionen

• production : Produktionsmodus-Flag, Standard: false
• prod : Alias ​​für production

yarn start oder npm run start

Ausführen von Projekten im Produktionsmodus.

Optionen

• open : Browser beim Start öffnen, Standard: false
• port : Geben Sie den Server-Port an, Standard: 2080

yarn deploy oder npm run deploy

Stellen Sie den dist -Ordner auf GitHub Pages bereit.

Optionen

• branch : Der Name des Branchs, zu dem Sie pushen, Standard: 'gh-pages'

yarn clean oder npm run clean

Bereinigen Sie die dist und temp Dateien.

Ordnerstruktur

 └── 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

Verwandt

• zce/x-pages – Ein vollständig verwalteter Gulp-Workflow für Websites mit statischen Seiten.

Mitwirken

1. Forken Sie es auf GitHub!
2. Klonen Sie den Fork auf Ihren eigenen Computer.
3. Checken Sie Ihren Feature-Zweig aus: git checkout -b my-awesome-feature
4. Übertragen Sie Ihre Änderungen in Ihren eigenen Zweig: git commit -am 'Add some feature'
5. Schieben Sie Ihre Arbeit wieder nach oben zu Ihrem Fork: git push -u origin my-awesome-feature
6. Senden Sie eine Pull-Anfrage, damit wir Ihre Änderungen überprüfen können.

HINWEIS : Stellen Sie sicher, dass Sie die neueste Version von „Upstream“ zusammenführen, bevor Sie eine Pull-Anfrage stellen!

Lizenz

MIT © 汪磊