谷歌Web Starter Kit 起步套件

 

Web Starter Kit

 

Web Starter kit是一个来自Google的构建响应式网站的模板。支持不一样的设备,而且由gulp.js 构建,同时支持跨设备同步测试.git

多设备同步测试采用了  BrowserSync 。BrowserSync 是一个基于socket.io 的Node 应用,当你更改文件的时候,它能够自动的改变页面。它 ( 指BrowserSync ) 还有  gulp.js 模块 ,你能够在你的项目中使用它。github

 

仓库地址web

https://github.com/google/web-starter-kitnpm

 

内置特效gulp

  • 响应式模板
  • SASS支持  经过gulp serve或者 在生成环境中使用gulp
  • 性能优化 压缩JSS、CSS、HTML、图片文件
  • 代码检查  ESLINT
  • 内置的HTTP Server 经过gulp serve
  • 实时的页面刷新 使用browser-sync
  • 能够使用ES2015  To enable ES2015 support remove the line "only": "gulpfile.babel.js", in the .babelrc file.
  • 页面性能分析 run gulp pagespeed
  • 内置的service worker 在Https的域名下面自动使能

 

发布到你的Github Pages性能优化

参考文档 https://github.com/yeoman/generator-webapp/blob/master/docs/recipes/gh-pages.mdbabel

1. 建立一个新的仓库app

2. git remote add origin https://github.com/you/webapp.gitwebapp

3. npm install --save-dev gulp-gh-pagessocket

建立一个gulp task 

// deploy to github pages
gulp.task('deploy', () => {
  return gulp.src('dist/**/*')
    .pipe($.ghPages());
});

 

4. git checkout --orphan gh-pages

5. git commit -m 'initial commit' --allow-empty

6. git push origin gh-pages

7. 最后 RUN gulp deploy

 

若是失败了,运行下面的命令

rm -rf .publish

而后从新gulp deploy

相关文章
相关标签/搜索