Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update docs for new CSS modules features #1028

Merged
merged 2 commits into from May 25, 2022
Merged

Update docs for new CSS modules features #1028

merged 2 commits into from May 25, 2022

Conversation

devongovett
Copy link
Member

@vercel
Copy link

vercel bot commented May 22, 2022

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated
website ✅ Ready (Inspect) Visit Preview May 25, 2022 at 2:51PM (UTC)

{% endsamplefile %}
{% endsample %}

To reference a global variable, use the `from global` syntax:
Copy link
Member

@mischnic mischnic May 24, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is there a way to declare a global variable in a CSS module asset?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

no, you'd have to do it by importing a non-css module. I can note this


{% warning %}

**Note**: CSS grid line names can be ambiguous due to automatic postfixing done by the browser, which generates line names ending with `-start` and `-end` for each grid template area. When using CSS grid, ensure that your `"pattern"` configuration ends with the `[local]` placeholder so that these references work correctly.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nit: Doesn't parcel-css throw an error if the user didn't respect this? Then I'd rather phrase this as "When using CSS, your pattern configuation has to end ... "

### Enabling CSS modules globally

By default, CSS modules are only enabled for files ending with `.module.css`. All other CSS files are treated as global CSS by default. However, this can be overridden to enable CSS modules for all files by configuring `@parcel/transformer-css` in your project root `package.json`.
By default, CSS modules are only enabled for filenames ending with `.module.css`. All other CSS files are treated as global CSS by default. However, this can be overridden to enable CSS modules for all source files (i.e. not in `node_modules`) by configuring `@parcel/transformer-css` in your project root `package.json`.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

How can CSS modules be enabled for a filename?
Maybe "for files whose name ends with"?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants