Adapted from https://devdocs.magento.com/guides/v2.2/frontend-dev-guide/css-topics/css_debug.html

– Install nodejs somewhere

apt-get install node

– cd (magento root)
– move ./package.json.sample to just package.json
– move Gruntfile.js.sample to Gruntfile.js
– install grunt, probably as root

npm install -g grunt-cli

– update Magento’s node dependencies

npm install

– make sure your style sheet is added to (your theme)/Magento_Theme/layout/default_head_blocks.xml

– make sure your source files exist

[dev@/var/www/ecommsys/app/design/frontend/Siliconrockstar/base][22s] tree ./web/
 ./web/
 └── css
 ├── source
 ├── styles.less
 └── _variables.less

– add your theme to ./dev/tools/grunt/configs/themes.js

///////////
 base: {
   area: 'frontend',
   name: 'Siliconrockstar/base',
   locale: 'en_US',
   files: [
     'css/styles-m',
     'css/styles-l',
     'css/some-customer-stylesheet'
   ],
   dsl: 'less'
 }

– run the grunt task to prep the symlinks for your static content files

grunt --verbose exec

– have grunt compile your less

grunt --verbose less

As far as I can tell, you either need to

– compile the both your themes’ css and all parent themes’ css, or
– add the stylesheets for the parent theme ( usually styles-m and styles-l ) to the grunt config for your own theme

…to make sure changes show.

 

BONUS:

If you just need to add some simple simple css changes, you can toss them into _extend.less and they’ll automatically compile and append to the parent themes’s styles. Not sure if you need to add the grunt config or not…

[dev@/var/www/ecs/app/design/frontend/Siliconrockstar/base/web][0s] tree ./css/
./css/
└── source
 └── _extend.less