I have a static site that compile Sass using node-sass
.
我有一个使用node-sass编译Sass的静态站点。
Currently I'm using Grunt to watch the file, but I feel it's overkill because I can use their built-in CLI.
目前我正在使用Grunt来观看文件,但我觉得它太过分了,因为我可以使用它们的内置CLI。
So I add this in my package.json:
所以我在package.json中添加:
// package.json
...
"scripts": {
"sass": "node-sass -w input/dir -o output-dir/"
}
The problem is, I need to require
a Sass framework module (installed globally) in the --include-path
. I can do this in Gruntfile:
问题是,我需要在--include-path中要求一个Sass框架模块(全局安装)。我可以在Gruntfile中执行此操作:
// Gruntfile.js
sass: {
options: {
includePaths: require("the-framework").includePaths()
},
...
},
So the first thing that come to my mind is to interpolate the string like:
所以我想到的第一件事就是插入字符串:
// package.json
...
"scripts": {
"sass": "node-sass -w input/dir -o output-dir/ --include-path " + require("the-framework").includePaths()
}
And as expected, it doesn't work. Well the script runs, but the interpolated variable is ignored.
正如预期的那样,它不起作用。然后脚本运行,但插值变量被忽略。
Any solution or alternative? If possible, I would prefer not to create additional file just to store the variable.
任何解决方案或替代?如果可能的话,我宁愿不创建额外的文件来存储变量。
Thanks
谢谢
3 个解决方案
#1
5
I dont know is it a right way to do it, but I can explain how I will would solve this task.
我不知道这是一种正确的方法,但我可以解释如何解决这个问题。
You cant interpolate variables in package.json
, cause it must be valid json. That you can is to write bash commands here.
你不能在package.json中插入变量,因为它必须是有效的json。你可以在这里写bash命令。
1) You can write node command that will needed result. You should take care if includePaths()
does not return string.
1)您可以编写需要结果的节点命令。如果includePaths()没有返回字符串,您应该小心。
Node options:
-e, --eval script evaluate script
-p, --print evaluate script and print result
So it would be something like
所以它会是这样的
node -e "console.log(require('the-framework').includePaths())"
Or shorter version with --print
或者带有--print的更短版本
node -p "require('the-framework').includePaths()"
2) Inline output of previous command into sass script. Take care of right escaping.
2)将上一个命令内联输出到sass脚本中。照顾正确的逃脱。
{
"scripts": {
"sass": "node-sass -w input/dir -o output-dir/ --include-path $(node -p \"require('the-framework').includePaths()\")"
}
}
More info about executing bash command you can find here.
有关执行bash命令的更多信息,请点击此处。
P.S. Windows version differs
附: Windows版本不同
{
"scripts": {
"sass": "FOR /f \"delims=\" %v IN ('node -p \"require('edje').includePaths()[0]\"') DO node-sass -w assets/sass -o assets/css --include-path \"%v\""
}
}
More info you can find here.
您可以在此处找到更多信息。
#2
0
You can something like this:
你可以这样:
“scripts”: {
“sass”: “node-sass --include-path scss scss/main.scss public/css/main.css”
},
#3
0
There are many ways you could solve this with npm scripts.
使用npm脚本可以通过多种方式解决此问题。
The first one that comes to my mind by looking at your specific need is, npm accepts extra parameters when calling a script. For example:
通过查看您的特定需求,我想到的第一个是,在调用脚本时,npm接受额外的参数。例如:
npm run sass -- path/to/the-framework
This will resolve to:
这将解决:
node-sass -w input/dir -o output-dir/ --include-path path/to/the-framework
Another way would be to move your code in a .js
executable file (Node), let's call it watch-sass.js
.
另一种方法是将代码移动到.js可执行文件(Node)中,让我们称之为watch-sass.js。
So your script will look like:
所以你的脚本看起来像:
"sass": "node watch-sass.js"
And you would run:
你会运行:
npm run sass
This way you have much more freedom to do anything you want in your file.
这样您就可以更*地在文件中执行任何操作。
Possibilities are infinite really, you could leverage the power of bash script instead of JS if you want, they can all read/write environment variables. But you don't necessarily need them. For instance you could just have a shell script that writes a package.json for you (or Python, or Ruby...), with all the variables already in place. But in the end I think it's just a matter of taste, use what you find simpler or more comfortable to use.
可能性是无限的,如果你愿意,你可以利用bash脚本而不是JS的强大功能,它们都可以读/写环境变量。但你不一定需要它们。例如,您可以拥有一个shell脚本,为您(或Python或Ruby ...)编写package.json,并且所有变量都已就位。但最后我觉得这只是一个品味问题,使用你觉得更简单或更舒适的东西。
#1
5
I dont know is it a right way to do it, but I can explain how I will would solve this task.
我不知道这是一种正确的方法,但我可以解释如何解决这个问题。
You cant interpolate variables in package.json
, cause it must be valid json. That you can is to write bash commands here.
你不能在package.json中插入变量,因为它必须是有效的json。你可以在这里写bash命令。
1) You can write node command that will needed result. You should take care if includePaths()
does not return string.
1)您可以编写需要结果的节点命令。如果includePaths()没有返回字符串,您应该小心。
Node options:
-e, --eval script evaluate script
-p, --print evaluate script and print result
So it would be something like
所以它会是这样的
node -e "console.log(require('the-framework').includePaths())"
Or shorter version with --print
或者带有--print的更短版本
node -p "require('the-framework').includePaths()"
2) Inline output of previous command into sass script. Take care of right escaping.
2)将上一个命令内联输出到sass脚本中。照顾正确的逃脱。
{
"scripts": {
"sass": "node-sass -w input/dir -o output-dir/ --include-path $(node -p \"require('the-framework').includePaths()\")"
}
}
More info about executing bash command you can find here.
有关执行bash命令的更多信息,请点击此处。
P.S. Windows version differs
附: Windows版本不同
{
"scripts": {
"sass": "FOR /f \"delims=\" %v IN ('node -p \"require('edje').includePaths()[0]\"') DO node-sass -w assets/sass -o assets/css --include-path \"%v\""
}
}
More info you can find here.
您可以在此处找到更多信息。
#2
0
You can something like this:
你可以这样:
“scripts”: {
“sass”: “node-sass --include-path scss scss/main.scss public/css/main.css”
},
#3
0
There are many ways you could solve this with npm scripts.
使用npm脚本可以通过多种方式解决此问题。
The first one that comes to my mind by looking at your specific need is, npm accepts extra parameters when calling a script. For example:
通过查看您的特定需求,我想到的第一个是,在调用脚本时,npm接受额外的参数。例如:
npm run sass -- path/to/the-framework
This will resolve to:
这将解决:
node-sass -w input/dir -o output-dir/ --include-path path/to/the-framework
Another way would be to move your code in a .js
executable file (Node), let's call it watch-sass.js
.
另一种方法是将代码移动到.js可执行文件(Node)中,让我们称之为watch-sass.js。
So your script will look like:
所以你的脚本看起来像:
"sass": "node watch-sass.js"
And you would run:
你会运行:
npm run sass
This way you have much more freedom to do anything you want in your file.
这样您就可以更*地在文件中执行任何操作。
Possibilities are infinite really, you could leverage the power of bash script instead of JS if you want, they can all read/write environment variables. But you don't necessarily need them. For instance you could just have a shell script that writes a package.json for you (or Python, or Ruby...), with all the variables already in place. But in the end I think it's just a matter of taste, use what you find simpler or more comfortable to use.
可能性是无限的,如果你愿意,你可以利用bash脚本而不是JS的强大功能,它们都可以读/写环境变量。但你不一定需要它们。例如,您可以拥有一个shell脚本,为您(或Python或Ruby ...)编写package.json,并且所有变量都已就位。但最后我觉得这只是一个品味问题,使用你觉得更简单或更舒适的东西。