[英]react styled components not working in production
I have been able to work with styled-components on webpack dev server without any problem but the styles are not getting added when building the project for production with webpack -p --progress --colors
or running webpack -d --progress --colors --watch
我已经能够在 webpack 开发服务器上使用 styled-components 没有任何问题,但是在使用
webpack -p --progress --colors
或运行webpack -d --progress --colors --watch
构建生产项目时没有添加样式webpack -d --progress --colors --watch
The only style added in production is an empty style生产中添加的唯一样式是空样式
<style data-styled="" data-styled-version="4.4.1"></style>
in the webpack.config.js i have the following rules that is running for both dev and production:在 webpack.config.js 中,我有以下为开发和生产运行的规则:
module: {
rules: [
{
test: /\.js?$/,
exclude: /(node_modules|bower_components)/,
loader: 'babel-loader',
query: {
presets: ['react', 'es2015', 'stage-0'],
plugins: ['react-html-attrs', 'transform-decorators-legacy', 'transform-class-properties'],
}
},
]
}, },
Plugins, note that debug is used to if is production build插件,注意 debug 用于 if is production build
plugins: debug ? [
new HtmlWebpackPlugin({
template: path.resolve(__dirname, 'template.html')
})
] : [
new webpack.DefinePlugin({
"process.env": {
NODE_ENV: JSON.stringify("production"),
},
}),
new CleanWebpackPlugin(),
new webpack.optimize.OccurrenceOrderPlugin(),
new UglifyJsPlugin(),
new HtmlWebpackPlugin({
template: path.resolve(__dirname, 'template.html')
})
],
dev server settings:开发服务器设置:
devServer: {
contentBase: BUILD_DIR,
historyApiFallback: true,
watchContentBase: true,
port: 9000
},
do you have a global style created with createGlobalStyle
that contains a css @import
?您是否有使用
createGlobalStyle
创建的包含 css @import
的全局样式? Removing the import from my site just fixed the issue for me.从我的网站删除导入只是为我解决了这个问题。 (sounds like the same issue).
(听起来像同样的问题)。
https://github.com/styled-components/styled-components/issues/2911#issuecomment-592012166 https://github.com/styled-components/styled-components/issues/2911#issuecomment-592012166
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.