All Projects → zanseven007 → generator-zyy-h5

zanseven007 / generator-zyy-h5

Licence: other
A lovely H5 template

Programming Languages

javascript
184084 projects - #8 most used programming language
CSS
56736 projects
HTML
75241 projects

Projects that are alternatives of or similar to generator-zyy-h5

Buddycss
The framework for people who love coding!
Stars: ✭ 89 (+286.96%)
Mutual labels:  gulp, css3
Front-end-tutorial
🐼 最全的资源教程-前端涉及的所有知识体系,并在 Nice Front-end Tutorial 持续更新;
Stars: ✭ 1,655 (+7095.65%)
Mutual labels:  gulp, css3
Magic
CSS3 Animations with special effects
Stars: ✭ 7,253 (+31434.78%)
Mutual labels:  gulp, css3
Css Flags
A collection of pure CSS flags, all single divs.
Stars: ✭ 90 (+291.3%)
Mutual labels:  gulp, css3
Portfolio one Page Template
Free responsive one page portfolio template
Stars: ✭ 106 (+360.87%)
Mutual labels:  gulp, css3
Front-End-Study
学习、总结、提升
Stars: ✭ 13 (-43.48%)
Mutual labels:  gulp, css3
Fe
前端热门文章阅读
Stars: ✭ 174 (+656.52%)
Mutual labels:  gulp, css3
design-studio one-page-template
Free responsive flat designed one page template
Stars: ✭ 67 (+191.3%)
Mutual labels:  gulp, css3
Nova-Dark-Theme
A dark theme for Laravel Nova
Stars: ✭ 72 (+213.04%)
Mutual labels:  css3
generator-vintage-frontend
Modern front-end workflow
Stars: ✭ 15 (-34.78%)
Mutual labels:  gulp
ux-theming
Make UX theming in Mendix a lot easier
Stars: ✭ 22 (-4.35%)
Mutual labels:  gulp
gulp-yarn
Automatically install node modules using Yarn. 😻
Stars: ✭ 22 (-4.35%)
Mutual labels:  gulp
kironroy.github.io
Portfolio
Stars: ✭ 14 (-39.13%)
Mutual labels:  css3
norman-portfolio
Norman Nuthu's Portfolio
Stars: ✭ 16 (-30.43%)
Mutual labels:  css3
tux
A baseline toolkit to ease the building of static HTML sites or integrating into templated CMS builds.
Stars: ✭ 34 (+47.83%)
Mutual labels:  gulp
currency-exchange
Currency Exchange | powered by Angular 10, TypeScript, ES6+ features, SCSS, JavaScript, PWA
Stars: ✭ 13 (-43.48%)
Mutual labels:  css3
Anchor-Bootstrap-UI-Kit
Anchor is a free Bootstrap UI Kit with flexible, ready to use UI components which will hep you build websites faster.
Stars: ✭ 69 (+200%)
Mutual labels:  gulp
postcss-font-grabber
A postcss plugin, it grabs remote font files and update your CSS, just like that.
Stars: ✭ 26 (+13.04%)
Mutual labels:  gulp
unitscss
UNITS is a simple and beautiful CSS component set.
Stars: ✭ 13 (-43.48%)
Mutual labels:  css3
modest-tsc-ng1-boilerplate
No description or website provided.
Stars: ✭ 36 (+56.52%)
Mutual labels:  gulp

基于webpack和gulp的H5小项目生成器

English docs

  • H5 日益普及,为了方便日后开发的方便,特此写一个模板生成器为日后使用
  • 在HTML中支持使用 @@include 引入一个 .inc 文件
  • 在CSS文件中可以使用 scss 进行开发,发布时将小图片转换为base64格式
  • 预置了一些动画库和常用的动画逻辑代码,方便写出丝滑的动画
  • 在JS当中利用webpack合并了公共模块,可以有任意个入口文件,并区分生产和开发环境(开发环境不进行代码压缩,极大提高打包速度)
  • 开发时可自动启动 Chrome 浏览器,并且打开本地3000端口来调试

使用yoeman创建模板

安装 yo

[sudo] npm install -g yo

安装H5模板生成器

[sudo] npm install -g generator-zyy-h5

新建一个项目目录并进入

mkdir my-new-h5 && cd $_

使用H5模板,这个命令会自动安装依赖(npm install),建议终止掉,然后使用 cnpmyarn 来安装,因为速度飞快。

yo zyy-h5

使用模板

开发

gulp dev

发布(会压缩css和js,并增加md5)

gulp dist

可选参数

  • --html 压缩 html 文件,发布线上需要时可以加上 gulp dist --html

ISSUE

node-sass安装失败解决办法:因为在安装node-sass的时候它把github Releases里的文件都托管在s3.amazonaws.com上面,而这个网址在国内总是网络不稳定,所以推荐使用cnpm,yarn来安装我们的依赖,也可以通过淘宝镜像去下载这个文件。

直接运行下面的命令即可

SASS_BINARY_SITE=https://npm.taobao.org/mirrors/node-sass/ npm install node-sass  && npm install gulp-sass

License

MIT © zanseven007

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].