如何建立与新公共管理脚本多个输出文件?

问题描述 投票:0回答:1

我想NPM脚本而不是一饮而尽。而且我碰到这个问题,我可以有一个NPM脚本,例如,编译节点萨斯SCSS文件系统开发和督促或我应该为目的的多个脚本:

这里是我的package.json:

...

"scripts": {
    "scss": "node-sass app/src/styles/main.scss --output app/.tmp/styles/",
    "autoprefixer": "postcss -u autoprefixer -r app/.tpm/styles/*",
    "scss:prod": "node-sass app/src/styles/main.scss --output app/dist/styles/",
    "autoprefixer:prod": "postcss -u autoprefixer -r app/dist/styles/*",
    "cssnano": "postcss -u cssnano -r app/dist/styles/main.css",
    "build:styles": "npm run scss:prod && npm run autoprefixer:prod && npm run cssnano"
},

是否有可能我SCSS任务拆分为与用于开发和督促文件夹多个输出一个脚本?

npm npm-scripts
1个回答
2
投票

答案很简单:这是最好使用多个脚本用于这一目的


例如:

...
"scss:dev": "node-sass app/src/styles/main.scss --output app/dev/styles/"
"scss:prod": "node-sass app/src/styles/main.scss --output app/dist/styles/"
...

(请注意,唯一的区别是将输出/目标路径)

然后考虑把所有相关的任务devprod的样式。例如:

...
"build-styles:prod": "npm run scss:prod && ..."
"build-styles:dev": "npm run scss:dev && ..."
...

您也可以旨在对dev一个剧本,一个用于build做所有的任务,即那些除了刚处理相关任务的样式。例如:

...
"dev": "build-styles:dev && ..." 
"build": "build-styles:prod && ..."
...

然后,你可以通过你的CLI的必要,所有的任务都进行了简单的运行无论是$ npm run dev$ npm run build

注意:你会发现,有时一个脚本名称并不需要与无论是:prod:dev后缀来区分作为一个脚本可以用于任何目的(包括devbuild)。然而,典型地,当输出/目标路径然后不同考虑与任一:dev或根据需要:prod前缀。


为什么呢?

是的,不可否认这是相当繁琐,不是特别DRY,但它更容易为人们阅读和维护。 IMO“更容易阅读”和更好的可维护性每次都会获胜。

此外,你可能会发现,有时候它不仅是对于devbuild的要求之间不同的输出/目标路径。举个例子,对于dev目的,你可能希望你的任务命名"scss:dev"还包括更容易调试sourceMaps option - 但你并不特别想包含在最终版本/ DIST代码源地图。


但是,我必须有一个脚本或全世界都会停止旋转:)

是否有可能我SCSS任务拆分为与用于开发和督促文件夹多个输出一个脚本?

是的,它可能有一个脚本。鉴于您的OP命名"scss"你可以使用链接(&&)这样的脚本:

...
"scss": "node-sass app/src/styles/main.scss --output app/.tmp/styles/ && node-sass app/src/styles/main.scss --output app/dist/styles/"
...

或者,有一个额外的项目依赖关系:

...
"scss": "node-sass app/src/styles/main.scss --output app/.tmp/styles/ && catw app/.tmp/styles/main.css > app/dist/styles/main.css"
...

这将编译,其输出的初始main.scssmain.css。然后,我们catmain.css和输出的副本到dist文件夹。 (注:这是使用的,而不是catw cat因为cat不起作用跨平台)

© www.soinside.com 2019 - 2024. All rights reserved.