'layouts/tinymce.less' wasn't found

sage
1

Hi everybody,

I’m extremely new to the sage wordpress template, so new that I can’t get the css to compile!

So after running npm install and bower install, I try running gulp but get the error:

‘layouts/tinymce.less’ wasn’t found. Tried - /wordpress/wp-content/themes/sage-8.4.2/assets/styles/layouts/tinymce.less,layouts/tinymce.less in file /wordpress/wp-content/themes/sage-8.4.2/assets/styles/main.scss line no. 19.

It looks like the fonts and scripts compile because they appear in a dist folder, just not the styles… I have spent a few hours trying various things, but just can’t seem to get any ideas what the issue could be…

Help greatly appreciated!

3 Likes
2

Hey Dylan,

Are you using Node.js v6.0? Something in it doesn’t like the Sage 8 gulpfile.

You could roll back to v5.11.0 if you’re using NVM with:

nvm install 5.11.0
nvm use 5.11.0 default

which will make 5.11.0 the default version of node on your machine until you decide to upgrade to 6.0.

Otherwise, if you’re not going to be using any .less files, you can remove lines 88-90 from the gulpfile.js:

.pipe(function() {
      return gulpif('*.less', less());
    })

so that the whole cssTasks function ends up looking like this:

var cssTasks = function(filename) {
  return lazypipe()
    .pipe(function() {
      return gulpif(!enabled.failStyleTask, plumber());
    })
    .pipe(function() {
      return gulpif(enabled.maps, sourcemaps.init());
    })
    .pipe(function() {
      return gulpif('*.scss', sass({
        outputStyle: 'nested', // libsass doesn't support expanded yet
        precision: 10,
        includePaths: ['.'],
        errLogToConsole: !enabled.failStyleTask
      }));
    })
    .pipe(concat, filename)
    .pipe(autoprefixer, {
      browsers: [
        'last 2 versions',
        'android 4',
        'opera 12'
      ]
    })
    .pipe(cssNano, {
      safe: true
    })
    .pipe(function() {
      return gulpif(enabled.rev, rev());
    })
    .pipe(function() {
      return gulpif(enabled.maps, sourcemaps.write('.', {
        sourceRoot: 'assets/styles/'
      }));
    })();
};

and you should be able to compile.

Welcome to Roots!

7 Likes
3

Hey Paul,

Thanks for the reply. I ended up downgrading node which solved my issue!

1 Like
4

i got the same issue too, using nodejs 6.0.1,
ended up removing the .less option, now its works fine :slight_smile:

i think for now its better to use different version of nodejs maybe an LTS version (4.4.4) untill they fix the bugs in nodejs 6.0

5

Hello,

You don’t have to downgrade node, changing the the order makes it work perfectly (calling less after scss)
.pipe(function() { return gulpif('*.scss', sass({ outputStyle: 'nested', // libsass doesn't support expanded yet precision: 10, includePaths: ['.'], errLogToConsole: !enabled.failStyleTask })); }) .pipe(function() { return gulpif('*.less', less()); })

7 Likes
6

Thanks @MariamLachab, that worked perfectly for me (using node 6.3.0)

7

Same issue on node v 7. 1.0
Just cleared .less task as @paul_tibbetts suggested.

1 Like
8

Same issue on node v 6.10.3 with Bootstrap Sass.

I found that if you reverse the order of Less and SCSS in the gulp file, it drastically increases the gulp styles compiling time.

Removing the Less line all together is the best choice as it drops my compile time from 11s to 1.8s for styles alone.

9

Same issue with node v 6.11.4 with Bootstrap Sass. I commented out the less lines like suggested by @paul_tibbetts Works!