在npm run-script中使用node-sass监视选项
所以我在npm包脚本中运行任务,但是我想在npm start
传递watch选项。
这工作:
"scripts": { "scss": "node-sass src/style.scss dist/style.css -w" }
这不会编译,观察或抛出任何错误:
"scripts": { "scss": "node-sass src/style.scss dist/style.css", "start": "parallelshell \"npm run scss -- -w\"" }
如果没有并行工具,或者没有简写工作,就无法工作。
我认为问题是运行脚本传递引号中的额外的参数,所以命令出现如下:
node-sass src/style.scss dist/style.css "-w"
我希望这个工作没有添加任何依赖。 我错过了什么?
顺便说一句,我在Windows 10与命令提示符/ git bash。
这是我的CSS设置
"scripts": { "css": "node-sass src/style.scss -o dist", "css:watch": "npm run css && node-sass src/style.scss -wo dist" }, "devDependencies": { "node-sass": "^3.4.2" }
-o标志设置目录输出的CSS。 我有一个非观看版本的“css”,因为观看的版本“css:watch”不会在运行时立即生成〜它只是在更改时运行,所以我打电话给
npm run css
打电话之前
node-sass src/style.scss -wo dist
如果你只想让它在变化时运行,而不是在第一次运行时使用
"css:watch": "node-sass src/style.scss -wo dist"
在前面的答案的基础上,另一个select是利用NPM的自定义脚本参数保持DRY,不要在watch
脚本中重复build
脚本参数:
"scripts": { "build:sass": "node-sass -r --output-style compressed src/style.scss -o dist", "watch:sass": "npm run build:sass && npm run build:sass -- -w" }
在上面的例子中, watch:sass
脚本的工作原理如下:
- 运行
build:sass
脚本。 这将编译你的CSS。 - 再次运行
build:sass
脚本,但这次包含-w
标志。 当你的一个SASS文件改变时,这将编译你的CSS。
注意watch:sass
末尾使用的--
选项watch:sass
脚本。 这用于在执行脚本时传递自定义参数。 从文档 :
从npm@2.0.0开始,可以在执行脚本时使用自定义参数。 getopt使用特殊选项来分隔选项的结尾。 npm会把所有的参数直接传递给你的脚本。
顺便说一句,这是我的改变:
"scss": "node-sass src/style.scss dist/style.css", "start": "parallelshell \"npm run scss && npm run scss -- -w\"
现在,让这个通过我的postcss任务…