Foundation - 入门项目 - 几微学院 - 几微助手 | 微信商城 | 小程序商城

您可以使用一些可用的模板开始项目开发，这些模板可以通过 Yeti Launch 或基础CLI .您可以使用这些模板开始使用这些模板，使用 Gulp 构建系统来处理Sass，JavaScript，复制文件等.

基本模板

基本模板类似于SASS模板，它包含平面目录结构并且只编译SASS文件，在仅使用SASS时使用这个简单模板是很好的.您可以使用Yeti Launch或使用Foundation CLI使用基本模板，使用以下命令 :

$ foundation new --framework sites --template basic

要设置此项，首先运行 npm install ， bower install 并使用 npm start 命令运行它.您还可以从 Github 下载模板文件.

ZURB模板

它是CSS/SCSS，JavaScript，Handlebars模板，标记结构，图像压缩的组合，并使用SASS处理.您可以使用 Yeti Launch 或使用 Foundation CLI 使用以下命令 :

$ foundation new --framework sites --template zurb

要运行此模板，请按照基本模板中指定的相同步骤操作.您也可以从 Github 下载模板文件.

资产复制

您可以使用 Gulp 复制 src/assets 文件夹中的内容其中 assets 将成为您的项目文件夹.重要的是，SASS文件，JavaScript文件和图像不会受到此资产复制过程的影响，因为他们将拥有自己的复制内容的过程.

页面编译

您可以在三个文件夹下创建HTML页面，即页面，布局和部分，它们位于 src/目录.您可以使用 Panini 平面文件编译器，通过使用模板，页面为页面创建布局，HTML部分.此过程可以使用 Handlebars 模板语言完成.

SASS编译

您可以使用 Libsass .

JavaScript编译

JavaScript文件将与Foundation一起存储在 src/assets/js 文件夹下，并且所有依赖项都绑定到 app.js 文件中.文件将按照以下顺序和减号中的规定捆绑在一起;

基金会的依赖性.
文件将存储在 src/assets/js 文件夹下.
这些文件捆绑在一个名为 app.js 的文件中.

图像压缩

默认情况下，所有图像都将存储在 assets/img dist 文件夹下的文件夹.您可以使用支持JPEG，PNG，SVG和GIF文件的 gulp-imagemin 在构建生产时压缩图像.

BrowserSync

您可以创建一个 BrowserSync 服务器，该服务器是 http提供的同步浏览器测试://localhost:8000 并且能够使用此URL查看已编译的模板.当您的服务器运行时，页面会在您保存文件时自动刷新，您可以在工作时实时看到对页面所做的更改.

免责声明：以上内容(如有图片或视频亦包括在内)有转载其他网站资源，如有侵权请联系删除

软件更多

职业更多

数码更多

加载中...

几微助手