如何在jekyll

Question

我正在使用jekyll 3.4.0， 我正在使用sass来设计我的网站。 在编译时，它不会在_site文件夹中创建style.css.map文件，这对调试很有帮助。

我的config.yml文件

markdown: kramdown
port: 8080
sass:
  sass_dir: css
  sourcemap: true
  style: compact

Answer 1

我不认为Jekyll（尚）支持SASS源地图。

对于我的项目，我在部署脚本中添加了一个SASS构建步骤，该脚本生成源映射：

#!/bin/bash

# destination folder in which the build result will be stored
DEST="./_site/style"

# folder in which original SCSS files will be places
ORIGINALS=$DEST/originals

# folder in which include SCSS file will be places
INCLUDES=$ORIGINALS/_sass

# remove the previous version of the folder
rm $ORIGINALS -r
mkdir $ORIGINALS

# copy original SASS include files to output folder
cp ./_sass/ $ORIGINALS -r

# name of the entry point SCSS file (without the extension)
SASS_FILE=style

# copying the entry point SCSS file to the output folder
# (removing the frontmatter from the file)
tail -n +3 ./style/$SASS_FILE.scss > $ORIGINALS/$SASS_FILE.scss

# building the entry SCSS file
sass --load-path $INCLUDES --sourcemap=auto $ORIGINALS/$SASS_FILE.scss $DEST/$SASS_FILE.css

重要

不要忘记将您的Web服务器配置为服务器SCSS mime类型。

附加说明

重要的是，原始SCSS文件也会部署到Web服务器，以便浏览器可以访问它们！

同样需要将sourcemap参数设置为auto，以便将原始SCSS文件的正确相对路径插入到源图中。