Skip to content

Error when importing values in pure mode #21

Closed
@simonsmith

Description

@simonsmith

Hello,

I'm opening this issue off the back of - vercel/next.js#10142

It appears that when importing a value from another file when using pure mode an error is encountered. Example:

colors.css

@value blue: #001e62;

module.css

@value blue from "../colors.css";

CLI output:

Selector ":import("../colors.css")" is not pure (pure selectors must contain at least one local class or id)

Repository with a reproducible case - https://github.com/simonsmith/next-js-css-modules-unable-to-use--global-with-css-modules

npm install
npm run dev

Reproduce in tests
Find a test that references :import and add options: { mode: 'pure' } to see the same output in the console:

  {
    should: 'not localize imported alias',
    input: `
      :import(foo) { a_value: some-value; }

      .foo > .a_value { }
    `,
+   options: { mode: 'pure' },
    expected: `
      :import(foo) { a_value: some-value; }

      :local(.foo) > .a_value { }
    `,
  },

My rudimentary debugging has shown that the code checking for import in the class case is not entered, and instead we only see selector used

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions