Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/django/22.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Sass 杰基尔·萨斯_Sass_Gulp_Jekyll_Gulp Sass - Fatal编程技术网

Sass 杰基尔·萨斯

Sass 杰基尔·萨斯,sass,gulp,jekyll,gulp-sass,Sass,Gulp,Jekyll,Gulp Sass,嗨,我有一个网站设置。但是,我无法让jekyll将我在sass文件中所做的实际更改编译为每个文章帖子的css文件 我需要在我的吞咽文件中添加一些东西吗?我以为jekyll会自动将sass样式编译成css,而不需要在gulp中实现它?还是package.json 我使用gulp命令让sass工作并编译网站布局css文件夹,但是在文章部分和帖子中,当我更改每个文章的sass样式文件时,什么都不会发生,我必须直接编辑实际的css文件以查看更改 我遗漏了一些东西这是我的代码 { "name": "b

嗨,我有一个网站设置。但是,我无法让jekyll将我在sass文件中所做的实际更改编译为每个文章帖子的css文件

我需要在我的吞咽文件中添加一些东西吗?我以为jekyll会自动将sass样式编译成css,而不需要在gulp中实现它?还是package.json

我使用gulp命令让sass工作并编译网站布局css文件夹,但是在文章部分和帖子中,当我更改每个文章的sass样式文件时,什么都不会发生,我必须直接编辑实际的css文件以查看更改

我遗漏了一些东西这是我的代码

{
  "name": "browser-sync-jekyll",
  "version": "0.0.0",
  "description": "A starter project including full setup for Jekyll, GulpJS, SASS & BrowserSync",
  "main": "gulpfile.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "Shane Osbourne",
  "license": "ISC",
  "devDependencies": {
    "browser-sync": "^2.8.0",
    "gulp": "^3.9.0",
    "gulp-autoprefixer": "^2.3.1",
    "gulp-jade": "^1.0.1",
    "gulp-sass": "^2.0.4"
  },
  "repository": {
    "type": "git",
    "url": "https://github.com/shakyShane/jekyll-gulp-sass-browser-sync.git"
  },
  "keywords": [
    "jekyll",
    "gulp",
    "sass",
    "browsersync"
  ],
  "bugs": {
    "url": "https://github.com/shakyShane/jekyll-gulp-sass-browser-sync/issues"
  },
  "homepage": "https://github.com/shakyShane/jekyll-gulp-sass-browser-sync"
}



var gulp        = require('gulp');
var browserSync = require('browser-sync');
var sass        = require('gulp-sass');
var prefix      = require('gulp-autoprefixer');
var cp          = require('child_process');
var jade        = require('gulp-jade');

var messages = {
    jekyllBuild: '<span style="color: grey">Running:</span> $ jekyll build'
};




/**
 * Build the Jekyll Site
 */
gulp.task('jekyll-build', function (done) {
    browserSync.notify(messages.jekyllBuild);
    return cp.spawn('jekyll', ['build'], {stdio: 'inherit'})
        .on('close', done);
});




/**
 * Rebuild Jekyll & do page reload
 */
gulp.task('jekyll-rebuild', ['jekyll-build'], function () {
    browserSync.reload();
});




/**
 * Wait for jekyll-build, then launch the Server
 */
gulp.task('browser-sync', ['sass', 'jekyll-build'], function() {
    browserSync({
        server: {
            baseDir: '_site'
        },
        notify: false
    });
});




/**
 * Compile files from _scss into both _site/css (for live injecting) and site (for future jekyll builds)
 */
gulp.task('sass', function () {
    return gulp.src('assets/css/main.scss')
        .pipe(sass({
            includePaths: ['css'],
            onError: browserSync.notify
        }))
        .pipe(prefix(['last 15 versions', '> 1%', 'ie 8', 'ie 7'], { cascade: true }))
        .pipe(gulp.dest('_site/assets/css'))
        .pipe(browserSync.reload({stream:true}))
        .pipe(gulp.dest('assets/css'));
});


gulp.task('jade', function(){
  return gulp.src('_jadefiles/*.jade')
  .pipe(jade())
  .pipe(gulp.dest('_includes'));
});


/**
 * Watch scss files for changes & recompile
 * Watch html/md files, run jekyll & reload BrowserSync
 */
gulp.task('watch', function () {
    gulp.watch('assets/css/**', ['sass']);
    gulp.watch('assets/js/**', ['jekyll-rebuild']);
    gulp.watch(['index.html', '_layouts/*.html', '_includes/*'], ['jekyll-rebuild']);
    gulp.watch(['assets/js/**'], ['jekyll-rebuild']);
    gulp.watch('_jadefiles/*.jade', ['jade']);
});




/**
 * Default task, running just `gulp` will compile the sass,
 * compile the jekyll site, launch BrowserSync & watch files.
 */
gulp.task('default', ['browser-sync', 'watch']);
{
“名称”:“浏览器同步jekyll”,
“版本”:“0.0.0”,
“说明”:“一个入门项目,包括Jekyll、GulpJS、SASS和BrowserSync的完整设置”,
“main”:“gulpfile.js”,
“脚本”:{
“测试”:“echo\”错误:未指定测试\“&退出1”
},
“作者”:“Shane Osbourne”,
“许可证”:“ISC”,
“依赖性”:{
“浏览器同步”:“^2.8.0”,
“吞咽”:“^3.9.0”,
“大口自动刷新器”:“^2.3.1”,
“吞玉”:“^1.0.1”,
“大口大口喝”:“^2.0.4”
},
“存储库”:{
“类型”:“git”,
“url”:”https://github.com/shakyShane/jekyll-gulp-sass-browser-sync.git"
},
“关键词”:[
“杰基尔”,
“大口喝”,
“sass”,
“浏览器同步”
],
“臭虫”:{
“url”:”https://github.com/shakyShane/jekyll-gulp-sass-browser-sync/issues"
},
“主页”:https://github.com/shakyShane/jekyll-gulp-sass-browser-sync"
}
var gulp=需要(“gulp”);
var browserSync=require('browser-sync');
var sass=需要('gulp-sass');
var前缀=require('gulp-autoprefixer');
var cp=需要(“子流程”);
var jade=需要(“咕噜咕噜咕噜咕噜咕噜咕噜”);
变量消息={
jekyllBuild:'正在运行:$jekyllBuild'
};
/**
*建立Jekyll站点
*/
吞咽任务('jekyll-build',函数(完成){
browserSync.notify(messages.jekyllBuild);
返回cp.spawn('jekyll',['build'],{stdio:'inherit'})
.在(‘关闭’,完成)时;
});
/**
*重建Jekyll&重新加载页面
*/
gulp.task('jekyll-rebuild',['jekyll-build'],函数(){
重新加载();
});
/**
*等待jekyll构建,然后启动服务器
*/
gulp.task('browser-sync',['sass','jekyll build',function()){
浏览器同步({
服务器:{
baseDir:“\u站点”
},
通知:假
});
});
/**
*将文件从_scss编译到_site/css(用于实时注入)和site(用于将来的jekyll构建)
*/
吞咽任务('sass',函数(){
return gulp.src('assets/css/main.scss')
.管道(sass)({
IncludePath:['css'],
OneError:browserSync.notify
}))
.pipe(前缀(['last 15 versions','>1%,'ie 8','ie 7'],{cascade:true}))
.管道(大口目的地(“现场/资产/css”))
.pipe(browserSync.reload({stream:true}))
.管道(吞咽目的地(“资产/css”);
});
吞咽任务('jade',函数(){
返回一口src(“Jandirebles/*.jade”)
.pipe(jade())
.管道(吞咽目的地(“包括”);
});
/**
*查看scss文件的更改和重新编译
*观看html/md文件,运行jekyll并重新加载BrowserSync
*/
吞咽任务('watch',函数(){
狼吞虎咽的手表('assets/css/**',['sass']);
gulp.watch('assets/js/**',['jekyll-rebuild']);
gulp.watch(['index.html'、'u layouts/*.html'、'u includes/*']、['jekyll-rebuild']);
gulp.watch(['assets/js/**',['jekyll-rebuild']);
狼吞虎咽的手表(“jadistribles/*.jade”,“jade”);
});
/**
*默认任务,只运行'gulp'将编译sass,
*编译jekyll站点,启动BrowserSync&watch文件。
*/
gulp.task('default',['browser-sync','watch']);

尝试
Jekyll clean
命令,以便所有文件都可以重新生成,确保增量已关闭。

所以在gulp任务下,我认为Jekyll重建会触发sass,以便Jekyll发布资产来重建css?这是正确的吗?或者它也需要单独插入到吞咽过程中吗?很抱歉有任何困惑,我搜索了很多,没有人直接解决这个技术方面的问题。你不需要咕噜咕噜来管理sass,杰基尔做得非常好。为什么要狼吞虎咽?我就是这么想的。但若我更改文章的Sass文件样式并进行Jekyll构建。还有那一口。它不写css。什么事也没发生。