В самом начале проекта у меня импортированы стили сторонней библиотеки в формате css:
// не знаю, в чем была проблема сделать стили изолированно, но не об этом сейчас
import '@vkontakte/vkui/dist/vkui.css';
Далее у каждого компонента есть модульные стили
scss.
Сейчас
webpack вставляет стили библиотеки vkui и normalize.css в итоговый бандл
css в самый конец.
Нужно поменять их местами, т. е. сначала
scss, затем
css, а не наоборот.
Не соображу, почему так и от чего зависит.
webpack:
{
test: /\.(css|scss|sass)$/,
use: [
MiniCssExtractPlugin.loader,
{
loader: 'css-loader',
options: {
modules: {
exportGlobals: true,
localIdentName: '[local]--[hash:base64:5]',
auto: /\.module\.\w+$/i,
},
},
},
{
loader: 'sass-loader',
},
{
loader: 'postcss-loader',
options: {
postcssOptions: {
plugins: [
[
autoprefixer({
browsers: ['> 0%'],
}),
],
],
},
sourceMap: true,
},
},
],
},
index.js
import 'normalize.css';
import '@vkontakte/vkui/dist/vkui.css';
export const store = createStore(rootReducer, composeWithDevTools(applyMiddleware(thunk)));
console.log('store', store.getState());
ReactDOM.render(
<Provider store={store}>
<App />
</Provider>,
document.getElementById('root')
);