Question

我想一起运行Nodemon和node-sass观察器。

我在package.json文件上尝试了以下脚本。

"build-css": "node-sass --include-path scss scss/main.scss public/css/main.css",
"watch-css": "nodemon -e scss -x \"npm run build-css & nodemon server.js\""

和devDependencies是：

"devDependencies": {
    "node-sass": "^4.9.0",
    "nodemon": "^1.17.5"
},

它确实有效，但我的问题是如果我不在& nodemon server.js脚本中添加watch-css，它就不会运行服务器和网络应用。

对此有什么好的解决方案吗？

感谢。

Answer 1

package.js
-e是扩展名列表
https://www.npmjs.com/package/nodemon

"scripts": {
  "start": "nodemon app.js -e js,scss,pug"
},

app.js
https://www.npmjs.com/package/node-sass

var result = sass.renderSync({
  file: scss_filename,
  [, options..]
});

Answer 2

好的，我现在得到了这么多，我会把它作为一个答案，但我认为问题是非常开放的！我认为你必须根据要求改变方向。基本上如果它有效，那就不用担心了。

有各种解决方案，例如npm-run-all或concurrently，但我认为如果你记住"run-both": "npm run build-css & npm run watch-css"不是&，那么像"winsrv": "pm2 flush & pm2 reload server/ecosystem-win.json & pm2 logs", "winprod": "webpack --config ./webpack.config.js & npm run winsrv", "windev": "set NODE_ENV=development webpack --config webpack.dev.config.js"这样的第三个脚本就可以了。跨平台甚至跨壳（如windows cmd vs powershell）。所以我想说如果你在团队中工作，那么添加另一个dev-dependency可能会更容易。

但是我会为pm2发出号角，我认为它在生产和发展方面都很有用。生态系统文件特别有用。我也认为pm2完全取代了nodemon。不是nodemon是坏的，但pm2非常适合多个进程。以下是我的一些npm脚本：

"preprod": "./preprod.sh", // Makes backup of old files, changes symlink to the backup
"prod": "webpack --config ./webpack.config.js && pm2 flush && pm2 reload server/ecosystem-production.json",
"postprod": "./postprod.sh", // check files exist and relinks public to the new build

作为最后一件事，我将补充说npm脚本中的post / pre钩子非常有用。为三个脚本运行一个命令：

var sass = require("node-sass");
var fs = require("fs");
sass.render({file: "styles.scss"}, (err, results) => {
  if (err) { console.log(err); }
  fs.writeFile("styles.css", results.css, err => console.log);
  console.log('scss -> css complete!');
});

对于延迟表示抱歉，我分心并且遇到了一些障碍。

我决定尝试使用node-sass programmatic api，我不确定它有多聪明，但我学会了一两件事。

buildcss.js：

console.log("server.js...");
setInterval(function() {
  console.log("interval that prevents our so called server from exiting" );
}, 1000 * 60 * 60);

假冒server.js

{
  "apps": [
    {
      "name": "My Server",
      "script": "server.js",
      "watch" : ["server.js"]
    },
    {
      "name": "SCSS to CSS",
      "script": "buildcss.js",
      "watch": ["styles.scss"],
      "autorestart": false
    }
  ]
}

ecosystem.json（在更改时重新启动scss脚本.hmm ...）

...
"scripts": {
    "start": "pm2 logs && pm2 reload ecosystem.json && pm2 logs --out"
},

和package.json

npm start

^(# |)

我想补充一点，我通常通过webpack处理我的scss编译，并且不能真正代表这里使用的过程（但它似乎运行得很好！）。

Answer 3

非常感谢你的帮助。我按照你的指示。我从中得到了这个概念，并按照以下方式应用于我：

buildcss.js（在root）：

const sass = require('node-sass');
const fs = require('fs');
const path = require('path');

var path_style = path.resolve(__dirname, "scss")
var path_dist = path.resolve(__dirname, "public")

sass.render({file: path.join(path_style, '/main.scss')}, function (err, results) {
    if(err){
        console.log(err);
    }
    fs.writeFile(path.join(path_dist, '/css/main.css'), results.css, function (err) {
        console.log(err);
    });
   console.log('scss --> css completed.');
});

ecosystem.json（在root）：

{
  "apps" : [
    {
      "name": "My App",
      "script": "app.js",
      "watch": ["app.js"]
    },
    {
      "name": "SCSS to CSS",
      "script": "buildcss.js",
      "watch": ["./scss/main.scss"]
    }
  ]
}

和package.json：

  "scripts": {
    "start": "pm2 start ecosystem.json && pm2 logs --out"
  },

根据 package.json ，"start": "pm2 logs && pm2 reload ecosystem.json && pm2 logs --out"上的代码，这对我不起作用。我遇到了以下错误：

[TAILING] Tailing last 15 lines for [all] processes (change the value with --lines option)
[PM2][ERROR] No file to stream for app [all], exiting.npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! mysite@1.0.0 start: `pm2 logs && pm2 reload ecosystem.json && pm2 logs --out`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the mysite@1.0.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

从日志文件：

12 info lifecycle mysite@1.0.0~start: Failed to exec start script

一起观看SASS / SCSS和nodemon

3 个答案: