refactor: Determine CSS module by filename, not directory #1714

rschristian · 2022-07-24T23:23:57Z

What kind of change does this PR introduce?

Refactor

Did you add tests for your changes?

Edited existing

Summary

Changes CSS Module handling to be based upon filename, rather than directory.

The existing setup is rather unintuitive, as identical files are handled very differently depending upon where they are, and require different user code in order to take advantage of. Using file names to distinguish is far more transparent to the end user.

Does this PR introduce a breaking change?

Yes

Users using CSS Modules in the routes or components directory will need to update their file names to match the pattern *.module.css.

changeset-bot · 2022-07-24T23:24:00Z

🦋 Changeset detected

Latest commit: 8c5c4c7

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
preact-cli	Major

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

rschristian · 2022-07-24T23:27:16Z

packages/cli/lib/lib/webpack/run-webpack.js

-		warnings: false,
+		warnings: true,


Noticed when debugging.

We attempt to log warnings if stats.hasWarnings() is true:

preact-cli/packages/cli/lib/lib/webpack/run-webpack.js

Lines 167 to 169 in 3f389c2

if (field === 'warnings' && stats.hasWarnings()) {

fields = fields.concat(info.warnings.map(addCompilerPrefix));

}

However, info.warnings will always be empty w/out this change.

rschristian · 2022-07-24T23:28:53Z

packages/cli/lib/lib/webpack/webpack-base-config.js

-	const { cwd, isProd, isWatch, src, source } = env;
+	const { cwd, isProd, src, source } = env;


Just a consistency thing. Easier to scan if we're not switching between isProd and isWatch.

* refactor: Determine CSS module by filename, not directory * docs: Adding changeset * refactor: Project creation pull from templates 'main' branch * test: Updating tests * revert: Accidentally removed log message

* Chore: Updating html-webpack-plugin to v4 (#1608) * chore: Correcting changeset * feat: webpack v5 (#1645) * feat: webpack-v5 * test: Update tests * docs: Updating docs to reflect changes * chore: Removing optimize-plugin local patch * refactor: Determine CSS module by filename, not directory (#1714) * refactor: Determine CSS module by filename, not directory * docs: Adding changeset * refactor: Project creation pull from templates 'main' branch * test: Updating tests * revert: Accidentally removed log message * refactor: Extracting project creation out to own package (#1708) * refactor: Extracting out project creation to own package * docs: Adding changeset * refactor: Misc edits to common deps & workspace helper scripts * test: Fixing 'create' test suite * ci: Increase minimum Node version * chore: Fix typos * docs: Update ReadMe instructions * chore: Better (and untaken) package name * docs: Update changeset * test: Update 'create' test suite & build output hashes * docs: Expounding upon changeset * refactor: Drop Preact 8 support (#1716) * refactor: Drops support for Preact v8 * docs: Adding changeset * refactor: Switch to automatic runtime JSX transform (#1725) * refactor: Switch over to automatic runtime transform for JSX * test: Removing `h` imports from test suite * docs: Adding changeset * docs: Adding readme for create-cli (#1728) * docs: Adding readme for create-cli * feat: Initial publish * fix: Correcting broken readme links * refactor: Disable hashing ssr-build's css (#1733) * refactor: Disable hashing ssr-build's css * docs: Adding changeset * test: Fix unrelated change from altered template * refactor: Remove `--preload` flag (#1737) * refactor: Removes `--preload` flag & functionality * docs: Adding changeset * docs: Updating readme for removal of preload * refactor: Separate internal concepts of config and env (#1734) * refactor: Separate internal concepts of config and env * docs: Adding changeset * refactor: prune flags (#1752) * refactor: Revise inconsistent, unused, and deprecated flags * docs: Adding changeset * feat: Improved errors and warnings (#1758) * refactor: Better root error handling * refactor: Switch prerender plugin to be async for error gen * refactor: Simplify & improve compilation messages * refactor: Bump Node version, remove `src` arg in build & watch, and misc housekeeping (#1753) * refactor: Drop rimraf for built-in fs.rm * refactor: Drop src argument in build & watch cmds * refactor: Extract info cmd from CLI entrypoint * refactor: Remove update-notifier * refactor: Switch from fs.promises to fs/promises * docs: Adding changeset * refactor: Move EJS into user templates (`template.html`) (#1768) * refactor: Merging EJS templates and switcing preferred template extension to .ejs * test: Fixing test suite to reflect latest changes * chore: Cleaning * docs: Updating ReadMe * docs: Adding changeset * refactor: Add error message for <% preact.(head|body)End %> * chore: Publishing cli & create-cli * Refactor: Enable Prefresh by Default (#1772) * refactor: Enables HMR via Prefresh by default * docs: Adding changeset * test: Updating tests to reflect changes to templates * refactor: Remove Critters (perhaps temporarily) (#1778) * refactor: Remove Critters (perhaps temporarily) * docs: Adding changeset * chore: Publish v4.0.0-next.2 * refactor: Vendor Critters so that 7c811ac can be reverted (#1780) * docs: Remove CLI beta note from readme * docs: Bump minimum Node version listed in readme

refactor: Determine CSS module by filename, not directory

dc9f0e4

rschristian requested a review from a team as a code owner July 24, 2022 23:23

rschristian commented Jul 24, 2022

View reviewed changes

rschristian added 4 commits July 24, 2022 18:36

docs: Adding changeset

778d782

refactor: Project creation pull from templates 'main' branch

6036804

test: Updating tests

1f48325

revert: Accidentally removed log message

8c5c4c7

rschristian merged commit 42df870 into next Jul 25, 2022

rschristian deleted the refactor/css-modules branch July 25, 2022 00:50

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

refactor: Determine CSS module by filename, not directory #1714

refactor: Determine CSS module by filename, not directory #1714

rschristian commented Jul 24, 2022 •

edited

Loading

changeset-bot bot commented Jul 24, 2022 •

edited

Loading

rschristian Jul 24, 2022

rschristian Jul 24, 2022

	if (field === 'warnings' && stats.hasWarnings()) {
	fields = fields.concat(info.warnings.map(addCompilerPrefix));
	}

		const { cwd, isProd, isWatch, src, source } = env;
		const { cwd, isProd, src, source } = env;

refactor: Determine CSS module by filename, not directory #1714

refactor: Determine CSS module by filename, not directory #1714

Conversation

rschristian commented Jul 24, 2022 • edited Loading

changeset-bot bot commented Jul 24, 2022 • edited Loading

🦋 Changeset detected

rschristian Jul 24, 2022

Choose a reason for hiding this comment

rschristian Jul 24, 2022

Choose a reason for hiding this comment

rschristian commented Jul 24, 2022 •

edited

Loading

changeset-bot bot commented Jul 24, 2022 •

edited

Loading