-
Notifications
You must be signed in to change notification settings - Fork 513
Using extract-text & commons-chunk together, the css output for entry may or may not exist #459
Comments
I am also running into an issue using both the ExtractTextPlugin and CommonsChunkPlugin as well. I noticed that css imported by angular-ui-bootstrap, which is included in a vendor bundle, was not being displayed. After doing some debugging it seems that any css/scss in my project which is imported in the commons chunk will not appear in the project (either in the extracted css file or in the common module). CSS that is not imported by the vendor bundle does appear in the extracted css file. The problem goes away when the ExtractTextPlugin is disabled. Entriesentry: {
vendor: './vendor.js',
main: './main.js'
} Rules {
test: /\.scss$/,
loader: ExtractTextPlugin.extract({
fallback: 'style-loader',
use: ['css-loader', 'sass-loader']
})
},
{
test: /\.css$/,
loader: ExtractTextPlugin.extract({
fallback: 'style-loader',
use: 'css-loader'
})
}, Plugins new webpack.optimize.CommonsChunkPlugin({
name: 'vendor'
}),
new ExtractTextPlugin({
filename: 'styles.css'
}), |
@hanxinwei Could you try with |
This is because you've set That means every chunk will extract to this same location. Each one will overwrite the css output of the previous one. The fix is to change it to |
@jiaweihli Thx @hanxinwei See @jiaweihli's comment and feel free to reopen if still regressions |
Closing due to inactivity. Seems fixed #508, please test with latest version and feel free to reopen if still regressions. Thanks! |
depending on if the entry needs at lease one more css module.
I guess this is by design.
However this is kind of inconvenient, for the server have to check if the entry css exists and decide whether to append it.
Compare the entry js to css
js: If the entry js does nothing ( even if totally empty ), the output entry file still be generated.
css: if the entry css needs no more injection, there is no output file.
Is that possible to provide a option to generate empty entry css file?
Example repo
https://github.com/hanxinwei/extract-text-commons-chunk
Source
/src
/css
style.css
style2.css
/scripts
/apps
page.js
page2.js
/services
service.js
service2.js
Page.js
import service from '../services/service';
import service2 from '../services/service2';
import '../../css/style.css';
import '../../css/style2.css';
page2.js
import '../../css/style.css';
Config
module.exports = {
entry: {
page: './src/scripts/apps/page.js',
page2: './src/scripts/apps/page2.js'
},
output: {
path: path.resolve(__dirname, './build/'),
filename: 'scripts/[name].js'
},
module:
{
rules: [
{
test: /.css$/,
use: ExtractTextPlugin.extract('css-loader')
}
]
},
plugins: [
new webpack.optimize.CommonsChunkPlugin({
name: 'common'
}),
new ExtractTextPlugin('css/[name].css')
]
}
Output
/build
/scripts
common.js
page.js
page2.js
/css
common.css
page.css
There is no page2.css generated.
The text was updated successfully, but these errors were encountered: