Non-js imports are not to be watched

[droooney]

I've noticed this issue working with pug and less plugins. @import's in less and include's in pug don't seem to be watched. If I change any of the less or pug files that are directly imported in js file the watch process reflects but once I change some less file I import in this less file (or include a pug file) the watch process doesn't seem to react in any way. For example:

// mixins.less

.hidden {
  display: none;
}



// main.less

@import './mixins';

body {
  .hidden();
}

or in pug:

//- mixins.pug

mixin input(name)
  input(name=name)



//- main.pug

include ./mixins

form
  +input('email')

When you have a lot of mixins it's pretty annoying and watching files using rollup-watch doesn't seem to be very useful. Can this even be solved?

[tivac]

That's something the plugins should handle. modular-css handles this by injecting a bunch of import statements into the JS. Rollup will correctly follow them and then watch those files, but they get tree-shaken out since nothing ever references them.

https://github.com/tivac/modular-css/blob/master/src/rollup.js#L48-L71

[droooney]

So there is no way to use tree-shaking and count on watching non-js files even if plugins were importing partials/includes/imports etc the way modular-css does?

[tivac]

Tree-shaking only works on JS code. If your non-JS is being transformed by a plugin into JS then it will have tree-shaking applied.

If the non-JS has it's own dependencies it'll be up to the plugin to transform those into ES2015-style dependencies using import if you want the non-JS files to be watched.

[droooney]

Well, I totally get that tree-shaking works on JS code only. But that doesn't make any sense to transform non-JS code into the ES6 modules only to get them tree-shaken. So that's the question: can I achieve both watching non-JS deps and (if they are transformed into JS files) not getting them tree-shaken?

[Rich-Harris]

Closing in favour of rollup/rollup#1203