Blog management system - Home Development

A, less, scss configuration

Since the create-react-app I am using a relatively new version, we have supported scss, but we also need to install dependencies:

cnpm install node-sass sass-loader --save

View webpack.config.js files can be found:

// style files regexes
const cssRegex = /\.css$/;           
const cssModuleRegex = /\.module\.css$/;
sassRegex const = /\.(scss|sass)$/ ;
const sassModuleRegex = /\.module\.(scss|sass)$/;

Support for the project has been configured scss, sass files, but does not support less files, so we need to modify cssRegex as follows:

cssRegex = const / \ (CSS |. less ) $ /;                 // support less

In addition, we also need to configure the less-loader:

Finally, we need to install the dependencies:

cnpm install  less less-loader --save

So that we can use .scss, .less files in the project.

Second, demand loading configuration antd

We can configure the  babel-plugin-import  to achieve antd components and style of on-demand loading , modify webpack.config.js file as follows:

Installation babel-plugin-import  -dependent:

cnpm install babel-plugin-import --save