Question

我想编译一个＆＃34; lite＆＃34;基础框架的版本。

我下载了＆＃34; scss＆＃34;和＆＃34; js＆＃34;来自foundation-sites Github存储库（https://github.com/zurb/foundation-sites）的文件夹，我创建了以下Gulp任务：

gulp.task('foundationCss', function(cb) {
  return gulp.src('foundation/scss/foundation.scss')
             .pipe(sass({outputStyle: 'compressed'}).on('error', sass.logError))
             .pipe(autoprefixer('last 2 version'))
             .pipe(gulp.dest(paths.dist + '/styles'));
});

gulp.task('foundationJs', function() {
  return gulp.src(['foundation/js/foundation.core.js',
                   'foundation/js/foundation.util.*.js',
                   'foundation/js/*.js'])
             .pipe(concat('foundation.min.js'))
             .pipe(minifyJs())
             .pipe(gulp.dest(paths.dist + '/scripts'));
});

这是正确的工作方式吗？我觉得有些不对劲，因为我遇到了一些布局问题。例如，我为＆＃34; topbar＆＃34;获得了不同的输出。 html，我在最新的Foundation 6（http://codepen.io/anon/pen/kXOmPA）和＆＃34; my＆＃34;基金会6（http://codepen.io/anon/pen/jAgQvL）。

我的Gulp任务有什么问题？

提前谢谢。

Answer 1

对于CSS，您需要包含Autoprefixer。对于JavaScript，如果您希望您的网站在Safari，InternetExplorer和Edge（没有或有限支持ES2015的浏览器）中工作，您需要包含Babel。

请参阅：http://foundation.zurb.com/sites/docs/javascript.html进行JavaScript设置，http://foundation.zurb.com/sites/docs/sass.html进行CSS设置。

如何编译Foundation源文件？

1 个答案: