Просмотр файлов SASS с помощью NPM node-sass

У меня установлен node-sass и установлены параметры, как в нижнем ответе на Использование опции просмотра node-sass с запуском npm-скрипта, однако мне это не подходит.

Это мой package.json файл с моей последней попыткой:

{
  "name": "linkup-paints",
  "description": "NPM for Linkup Paint Supplies website for 2019",
  "version": "1.0.2",
  "main": "index.js",
  "scripts": {
    "start": "run-script-os",
    "start:win32": "browser-sync start --server --files '**/*.css, **/*.html, **/*.js, !node_modules/**/*, !styles/**/*' --directory --port 7777 --browser \"C:\\Program Files\\Firefox Developer Edition\\firefox.exe\"",
    "build-sass": "node-sass styles/main.scss css/main.css",
    "watch-sass": "node-sass -w styles/main.scss css/main.css"
  },
  "author": "dpDesignz",
  "license": "ISC",
  "devDependencies": {
    "browser-sync": "^2.26.3",
    "run-script-os": "^1.0.3",
    "node-sass": "^4.9.4"
  }
}

Итак, я пробовал:

"build:sass": "node-sass -r --output-style compressed styles/main.scss -o css/main.css",
"watch:sass": "npm run build:sass && npm run build:sass -- -w"

и:

"css": "node-sass styles/main.scss -o css/main.css",
"css:watch": "npm run css && node-sass styles/main.scss -wo css/main.css"

и:

"scss": "node-sass --watch styles/main.scss -o css/main.css"

и (как предложил sidthesloth):

"build-sass": "node-sass styles/main.scss css/main.css",
"watch-sass": "node-sass -w styles/main.scss css/main.css"

Я запускаю npm i, и когда это будет завершено, я запускаю npm start. Синхронизация браузера запускается и наблюдает за изменениями файла, но мой css/main.css не компилируется или не обновляется, когда я изменяю файл .scss.

Я только начал/узнал, как использовать NPM, поэтому любая помощь будет очень признательна. Я изучил руководства и ответы (включая Использование node-sass, Просмотрите и Скомпилируйте Sass за пять быстрых шагов и Использование node-sass для компиляции файлов Sass в скрипте npm) за последние 2 часа безуспешно.

Как я могу заставить мои watch и build работать?

Обновлять

Так что просто обновление для тех, кто ищет это в будущем, я не понимал, как работают сценарии, и не осознавал, что мои сценарии не выполняются параллельно друг другу. Я думал, что npm start запустил все мои скрипты, я не знал, что нужно вызывать их все. Мой окончательный файл package.json выглядит следующим образом:

{
  "name": "linkup-paints",
  "version": "1.0.3",
  "description": "NPM for Linkup Paint Supplies website for 2019",
  "main": "index.js",
  "directories": {
    "lib": "lib"
  },
  "scripts": {
    "start": "npm-run-all --parallel browser-sync build-sass watch-sass",
    "browser-sync": "browser-sync start --server --files '**/*.css, **/*.html, **/*.js, !node_modules/**/*' -w --directory --port 7777 --browser \"C:\\Program Files\\Firefox Developer Edition\\firefox.exe\"",
    "build-sass": "node-sass styles/main.scss css/main.css",
    "watch-sass": "node-sass -w styles/main.scss css/main.css"
  },
  "keywords": [
    "linkup",
    "2019"
  ],
  "repository": {},
  "author": "dpDesignz",
  "license": "ISC",
  "devDependencies": {
    "npm-run-all": "^4.1.3",
    "browser-sync": "^2.26.3",
    "node-sass": "^4.9.4"
  },
  "bugs": {
    "url": "http://support.dpdesignz.co"
  },
  "homepage": "http://www.dpdesignz.co"
}

В итоге я добавил сценарий npm-run-all и изменил свои аргументы start на npm-run-all --parallel browser-sync build-sass watch-sass, так как мне не нужна совместимость между ОС со старыми аргументами run-script-os, которые у меня были ранее. Я также поместил аргумент -w (--watch) в строку синхронизации браузера, чтобы созданные файлы .css запускали синхронизацию, поскольку сборка фактически заменяет файл .css, а не изменяет его в соответствии с требованиями синхронизации браузера по умолчанию.