bootstarted / css-split-webpack-plugin Goto Github PK

I load in less like so
{ test: /\.(less|css)$/, loader: ExtractTextPlugin.extract('css?-url&-autoprefixer&sourceMap!less?sourceMap') }
with plugins
new ExtractTextPlugin('[name].css'), new CSSSplitWebpackPlugin({ //IE9 will ignore any more than ~4000 selectors. This does the work for us of splitting into smaller files. imports: true, preserve: true })

Tried with and without preserve. Even with the preserved sheet, the source map won't load (testing in Chrome). Works fine when I comment out this plugin.

@izaakschroeder thanks for your work.
But IE's limit is not 4095 selectors?
An article about IE limits

Though it says 4095 rules in the article, but I have see some comments in the article said the limit maybe 4095 selectors, and I have test it myself. I think 4095 selectors maybe right.

Hi,

I know this is a huge change, but I've just tested using mini-css-extract-plugin instead of the extract-text-webpack-plugin, and it worked, though it had a warning on a deprecated Tapable.

Is Webpack 4 support planed?

Hello,

Is this supposed to work with webpack 2 ? I get this : Error: Cannot find module 'webpack/lib/SourceMapSource
Not sure if this is a configuration issue or a lack of webpack 2 support.

Thanks.

I am trying to set up css-split-webpack-plugin in my Rails application. It uses webpack-manifest-plugin to generate manifest.

When I compile my main.css file it gets splitted into two files:

• main-ba361f9ac7a251e81763-1.css
• main-ba361f9ac7a251e81763-2.css

but into the manifest is added the second file only:

cat public/packs/manifest.json
=>
...
  "main.css": "/packs/main-ba361f9ac7a251e81763-2.css",
  "main.css.map": "/packs/main-ba361f9ac7a251e81763-2.css.map",
...

Is it possible to fix this issue and include into the manifest both files? Like this:

...
  "main-1.css": "/packs/main-ba361f9ac7a251e81763-1.css",
  "main-1.css.map": "/packs/main-ba361f9ac7a251e81763-1.css.map",
  "main-2.css": "/packs/main-ba361f9ac7a251e81763-2.css",
  "main-2.css.map": "/packs/main-ba361f9ac7a251e81763-2.css.map",
...

I tried the 0.2.2 and it's not working with Webpack 2.

There is another import issue : Error: Cannot find module 'webpack/lib/RawSource'
Importing RawSource from webpack-sources resolve the import error but it crashed during the webpack build : http://pastie.org/10977708

There may be quite a few rules only used in certain circumstances. (eg. IE X specific rules, media queries etc.). They shouldn't be split by size but rules. Is it possible or any other ways to achieve this?

1. imports: true
2. publicPath: 'dist/'

The split file containing the imports is put in the right place under dist along with the pieces. However, the @import points to "dist/styles-1.css". Since these are relative to the current split file, it's looking under "dist/dist/styles-1.css".

Not a big deal on my end. I simply made my publicPath context-relative. Just thought I'd submit the issue in case others run into it.

compiler.plugin is not a function,
compiler.plugin api was removed in webpack@5

css file for reference: http://i5.walmartimages.com/dfw/63fd9f59-333f/456358e1-5d9d-4410-a675-f0331c135039/v1/style.a714ac778d0a3fa9fb4f.css
used this to count css selectors: http://snippet.bevey.com/css/selectorCount.php
Total: 1580

then it should not split the css in 2 files but its currently happening