Having trouble resolving imports from a directory other than process.cwd()

[rocketspops]

Hey @simonsmith,

I am trying to @import files using glob and postcss-easy-import but I'm having trouble setting my import directory to something other than process.cwd(). Here is my Gulp task:

var paths = {
  styles: 'src/**/*--suit.css'
};

gulp.task('compile:css', function() {
  return gulp.src(paths.styles)
  .pipe(changedInPlace({ firstPass: true }))
  .pipe(print(function(filepath) { return "Compiled " + "'" + filepath + "'"; }))
  .pipe(suitcss({
    root: 'src',
    'postcss-easy-import': {
      glob: true
    },
    'postcss-calc': { precision: 0 },
    stylelint: {
      extends: 'stylelint-config-suitcss',
      rules: {
        'at-rule-empty-line-before': [ 'always',
          { 'ignore': [ 'all-nested', 'blockless-after-same-name-blockless' ] }
        ]
      }
    }
  }
  ))
  .pipe(rename(function(path){
    path.dirname += '/../';
    path.basename = path.basename.replace(/--suit/, '');
    return path
  }))
  .pipe(gulp.dest('src'));
});

In my css file, I have the following @import statement:

@import "/**/theme-switcher";

However, this results in an empty output file. But, if I change the import statement to:

@import "../../../**/theme-switcher";

The output file is compiled correctly. This confuses me since I've set root: 'src'. What am I missing!?

Also worth noting, once I set the postcss-easy-import option glob: true I'm unable to import suitcss components from the node_modules directory. For example, the following @import statements do not work as I expected:

@import "../../../**/suitcss-base";
@import "../../../**/suitcss-utils-text";

Any ideas?

Thanks,
Billy

[simonsmith]

Hey,

Sounds like you may have bumped into this issue with the import path. We need to get it fixed ASAP so it's on my list.

With regard to the second problem would you not just use @import "suitcss-base" to import from node_modules?

[rocketspops]

@simonsmith using @import "suitcss-base" results in an empty output file as well. I'm not sure if that is the intended functionality of postcss-easy-import or not. As soon as I flip glob: true it no longer automatically imports from node_modules etc.

cc/ @TrySound

[simonsmith]

I see, yes. It seems that's the intended behaviour of easy import. Looks like someone opened a pull request to enable globbing and module resolution but I think the author has abandoned postcss-easy-import so not sure when it would get merged.

I added a comment to this issue about it. Not sure what else to suggest there.

[simonsmith]

I'm now a collaborator on postcss-easy-import so hopefully I can get that PR merged soon

[rocketspops]

Awesome!

…

On Fri, Dec 9, 2016 at 7:44 AM, Simon Smith ***@***.***> wrote: I'm now a collaborator on postcss-easy-import so hopefully I can get that PR merged soon — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#4 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AAFnSkxrzTDZynZSGHMWN6XmfsC9Es3Oks5rGVtYgaJpZM4K_j4W> .

[simonsmith]

@rocketspops 2.0 is out - https://github.com/TrySound/postcss-easy-import/releases/tag/2.0.0

Can you see if that resolved your issues?

[rocketspops]

Hey @simonsmith,

No luck for me. I tried a few things but I keep getting this error message:

Error: ENOENT: no such file or directory, stat '/Users/wwhite11/Code/adel/src/*/stylesheets/suitcss/themes/theme--cti.css'

I'm using suit-preprocessor version 3.0.1. and I also upgraded postcss-easy-import to version 2.0 and specified it with the use option array in the preprocessor config. No luck.

I still can't seem to set the importRoot correctly either. Any ideas?

Thanks,
Billy

[simonsmith]

If you're using easy-import via suitcss-preprocessor then the issue might be we haven't moved it to 2.0 yet. There is an outstanding issue to do that piece of work.

Let's revisit this when I've fixed that issue.

[rocketspops]

Sounds good. I saw that ticket the other day and assumed as much. Cheers.

…

On Sat, Jan 21, 2017 at 3:15 AM, Simon Smith ***@***.***> wrote: If you're using easy-import via suitcss-preprocessor then the issue might be we haven't moved it to 2.0 yet. There is an outstanding issue <suitcss/preprocessor#72> to do that piece of work. Let's revisit this when I've fixed that issue. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#4 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AAFnSigcS_W6rA4lVUV42gM6frc0lq5aks5rUczFgaJpZM4K_j4W> .

[simonsmith]

I've released a new version of this plugin that uses the latest preprocessor. Apologies for the delay.

[rocketspops]

Hey @simonsmith I'll take a look! No apology necessary, I appreciate your continued support of these tools. Wish I could be more helpful.