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

main.css should not be loaded as CSS module via webpack #300

Open
sdimmick opened this issue Apr 1, 2017 · 1 comment
Open

main.css should not be loaded as CSS module via webpack #300

sdimmick opened this issue Apr 1, 2017 · 1 comment
Labels
V2.6.0 Webpack update V4
Milestone

Comments

@sdimmick
Copy link

sdimmick commented Apr 1, 2017

client/main.css is a standard, non-module stylesheet, but according to the CSS loaders defined in webpack.config.prod.js, it appears to be treated as a CSS module:

{
  test: /\.css$/,
  exclude: /node_modules/,
  loader: ExtractTextPlugin.extract('style-loader', 'css-loader?localIdentName=[hash:base64]&modules&importLoaders=1!postcss-loader'),
}, {
  test: /\.css$/,
  include: /node_modules/,
  loaders: ['style-loader', 'css-loader'],
}

This results in the stylesheet being loaded separately after the main HTML content of the page instead of with the main CSS manifest at the top of the page, as it should.

One potential solution would be to move non-module stylesheets into a separate directory, and define separate webpack loaders: one for CSS modules, and one for standard CSS files.

Something like:

var rawCSSDir = path.join(__dirname, 'client/style');

{
  test: /\.css$/,
  exclude: [/node_modules/, rawCSSDir],
  loader: ExtractTextPlugin.extract('style-loader', 'css-loader?localIdentName=[hash:base64]&modules&importLoaders=1!postcss-loader'),
}, {
  test: /\.css$/,
  include: rawCSSDir,
  loader: ExtractTextPlugin.extract('style-loader', 'css-loader?localIdentName=[hash:base64]&importLoaders=1!postcss-loader'),
},
@mannyhenri mannyhenri added the V2.5.0 React V16.x label Jun 2, 2018
@mannyhenri mannyhenri added this to To do in MERN Roadmap via automation Jun 2, 2018
@mannyhenri mannyhenri added this to the 2.5.0 milestone Jun 2, 2018
@mannyhenri
Copy link
Contributor

@rosariorussell you wan to take a look at this one?

@mannyhenri mannyhenri added V2.6.0 Webpack update V4 and removed V2.5.0 React V16.x labels Jul 12, 2018
@mannyhenri mannyhenri modified the milestones: 2.5.0, 2.6.0 Jul 12, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
V2.6.0 Webpack update V4
Projects
MERN Roadmap
  
To do
Development

No branches or pull requests

2 participants