如何解决Eleventy:更改Sass输出层次结构
我正在使用11ty建立一个静态网站,我想使用Sass。为此,我使用了eleventy-plugin-sass。它确实将Sass代码编译到CSS文件中,但是将输入层次结构复制到输出中。
例如,在我的输入文件夹中,我具有以下层次结构:
input/
_includes/
img/
posts/
src/
scss/
partials/
main.scss
当我运行npx @11ty/eleventy
时,它会编译为:
output/
img/
posts/
input/
src/
scss/
main.css
index.html
我想要类似的东西
output/
img/
posts/
css/
main.css
index.html
使用eleventy-plugin-sass
可以吗?如果没有,实现这一目标的另一种方式是什么?
解决方法
我刚刚发布了eleventy-plugin-sass
的新版本(1.1.0),您可以在其中使用新参数outputDir
自定义输出目录
看看这些。我基于此设置了 package.json 脚本,它按预期工作,实际上,由于一些小的更改/扩展,我将脚本复制到此处:
- https://egghead.io/lessons/11ty-add-sass-compiling-and-watch-for-changes-in-eleventy-11ty
- https://mvolkmann.github.io/blog/eleventy/styling-with-sass/
{
"name": "eleventy-from-start","version": "0.0.0","description": "A simple Eleventy starter","scripts": {
"build": "npm run sass && eleventy","sass": "sass src/assets/css/main.scss:_site/assets/css/main.css --load-path=node_modules","serve": "npm-run-all sass --parallel watch:*","watch:eleventy": "eleventy --serve --port=4300","watch:sass": "npm run sass -- --watch"
},....
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。