Just started out using React yesterday so setting up a demo app. Environment is:
I\'m try
The webpack config you use is a little different from the medium article.
In the medium article, the author uses style-loader and css-loader to process css file.
module.exports = {
entry: './main.js',
output: { path: __dirname, filename: 'bundle.js' },
module: {
loaders: [
...
{
test: /\.css$/,
loader: "style-loader!css-loader"
},
...
]
},
};
style-loader will inject the css code to tag. So that is why the tutorial work
In your webpack config, you use typings-for-css-modules-loader to load css. With this loader, you need to pass the css class variable name to className.
It means you should write the code like (simplify some code):
import * as React from "react";
import * as bs from 'bootstrap/dist/css/bootstrap.css';
import * as bst from 'bootstrap/dist/css/bootstrap-theme.css';
import { Button, Col, Row } from 'react-bootstrap';
import { Spinner } from '../shared/Spinner';
export class SigninForm extends React.Component {
...
render() {
return (
Right Side
);
}
}
Pass bt[classname] to className.
I think it will work.
btw, I find another medium article using typings-for-css-modules-loader -> link.