ember-css-modules icon indicating copy to clipboard operation
ember-css-modules copied to clipboard

Provide exclude glob option

Open arei opened this issue 2 years ago • 1 comments

Currently when processing our application, ember-css-modules, concats all the *.css files into a single file. This includes app/styles/*.css. Unfortunately, it seems to do it in whatever order it wants and with regards to things like @import. Thus we end up with an output file that has all of our component css files at the top and our app/styles/*.css at the bottom, apparently in alphabetical order. such that app.css comes before reset.css, which is problematic.

And headerModules doesnt seem to have an impact.

And importing via @import statements just lands us two copies of the css file being included.

So, unless we're doing something wrong, I think we need a way to control what files ember-css-modules includes and possibly in what order they are included.

Our config, for reference:

		cssModules: {
			generateScopedName(className, modulePath) {
				return className;
			},
			headerModules: [
				'app/styles/reset',
				'app/styles/toasts',
				'app/styles/tooltips',
				'app/styles/spinkit',
				'app/styles/ember-power-calendar',
			],
			plugins: [
				require('postcss-reporter')(),
				require('postcss-import')(),
				require('postcss-preset-env')({
					stage: 0,
				}),
			],
		},

@optikalefx

arei avatar May 19 '22 16:05 arei

Bump, is there anyone who can look at this?

optikalefx avatar Jun 09 '22 17:06 optikalefx