Reverse import

[Federico Zivolo]

Not sure if the title is clear.. well, actually I'm sure it is not.

Example:

// a.sss
$foo: 1

// b.sss
.b
  order: $foo

// c.sss
@import 'a'
@import 'b'

In this case, $foo in b.sss is undefined.
With Stylus it worked correctly (I'm converting a big Stylus code base).

Is it expected or am I doing something wrong somewhere else maybe?

[Andrey Sitnik]

In PostCSS logic is different.

You import a.pcss to c.pcss.

Not to global state.

[Federico Zivolo]

So I have to change the imports of the whole code base, d'oh!

Thanks, it makes sense.

[Nathan Kamusher]

The following instructions will solve the problem:

1. Module.export a variables object in a javascript config file (e.g. colors.js).
2. Configure postcss-simple-vars accordingly to use this module.

For comple example and instructions refer to 'Variables' section in the post-css-simple-vars description (github.com):

`// config/colors.js

module.exports = {
blue: '#056ef0'
}

// gulpfile.js

var colors = require('./config/colors');
var vars = require('postcss-simple-vars')

gulp.task('css', function () {
return gulp.src('./src/*.css')
.pipe(postcss([ vars({ variables: colors }) ]))
.pipe(gulp.dest('./dest'));
});`

[john paul]

HI, I have fallen on the same problem, but the instructions above make no sense to me. I understand the code needed for gulpfile.js , but cannot grasp the first step.

[Nathan Kamusher]

I break down the first step further:

1. You should create a java script config file
2. In this config file, create an object that will hold your variables as keys
3. In the config file, export this variables object, as shown in the 'colors' example given above
4. continue with the gulpfile as explained above.
   is that fix the problem?

[john paul]

Thank you, I will try this. Can I ask, why are we having this issue? Is this a solution that will need to be implemented in all installations of this package if we use it in future projects? or is it because the package we are using is out of date? should we try installing the most recent package? best John Paul Mobile: [phone]

…

On Tue, Dec 4, 2018 at 6:40 AM natank ***@***.***> wrote: I break down the first step further: 1. You should create a java script config file 2. In this config file, create an object that will hold your variables as keys 3. In the config file, export this variables object, as shown in the 'colors' example given above 4. continue with the gulpfile as explained above. is that fix the problem? — You are receiving this because you commented. Reply to this email directly, view it on GitHub <#61 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/APIG2iG6w0XQzTs-T2YUMdRxU8ERy6cqks5u1hj0gaJpZM4KpqUL> .