[Feature Request] Import CSS using the package.json main attribute

[oleersoy]

Hi,

I'm creating pure css packages (superfly-css). The workflow I'm using looks like this:

1. Create new public github repository
2. Clone the repository
3. Run npm init
4. Add the style attribute to package.json
5. Publish to NPM

If postcss-import read the main attribute for the css file that the package publishes, it would allow me to skip step 4. Right now the main attribute duplicates the style attribute.

Thoughts?

TIA,
Ole

[zoubin]

If you want to publish a package with both js and css (like a react component), how do you specify the main field?

[oleersoy]

You can still use both. What I'm asking for is that the main field be checked first for a .css resource, then the style attribute.

[MoOx]

When I create a package that is only css, I were using and index.css.
But why not. Open for PR.

[oleersoy]

Cool - Just did a quick code scan. Doesn't look too scary :). Hope to have PR in the coming days. 👍

[MoOx]

https://github.com/postcss/postcss-import/blob/master/index.js#L498

Please add tests for this... I am not sure if current behavior is tested :(, but should be to be sure we are not breaking anything

[oleersoy]

OK - Will add tests 👍

[MoOx]

Cool, thanks!

[oleersoy]

Here's a revised more defensive version that has all the current tests passing:

      packageFilter: function processPackage(pkg) {
        if (pkg && pkg.main && pkg.main.indexOf('.css') == -1) {
          pkg.main = pkg.style || "index.css"
        }
        return pkg
      },

[MoOx]

You should start that .css is at the end of the string, to be sure you don't catch things like "stuff.css/lib/thing.js"

[oleersoy]

OK - Will make sure to look at end of String. Something strange is going on. Here's what I'm doing.

1. Clone the repository
2. Run the tests ( Pass)
3. Introduce the code as is currently (13 tests fail)
4. Change the t.plan parameter from 17 to 16
5. All the tests pass

Weird right?

[oleersoy]

Updated implementation:

      packageFilter: function processPackage(pkg) {
        if (pkg && pkg.main && pkg.main.endsWith('.css') == -1) {
          pkg.main = pkg.style || "index.css"
        }
        return pkg
      },

This passes the current tests with the exception that I have to change the t.plan argument (Line 35) from 17 to 16.

[MoOx]

If you are removing some tests, it means it's hiding an issue.

[oleersoy]

I'm not removing any tests...I don't think. I'm only changing the parameter. That's why I think it's strange. I'm following these precise steps:

1. Clone the repository
2. Run the tests
3. Change the implementation
4. Change 17 to 16 (Without removing a corresponding test)
5. Run the tests
6. Everything passes

This should not be the case, but it is....I tested it twice.

The reason I think that it should not be the case is that in step 2 when I run the tests, tape expects 17 test results and that's what it gets. Then I change the implementation. If I don't change 17 to 16, 13 tests fail. If I change 17 to 16, then everything passes. I'm only changing the numbers. Not removing any tests correspondingly. Seems like a tape bug...

[MoOx]

I will take a look when I have some times. Thanks for sharing the snippet.

[oleersoy]

Cool - thanks - It's my first time using tape, so I just want to make sure I'm doing the right thing. I've run it 4 times now. Same result. I'll start working on a test for the pkg.main case.