1 修改端口关闭自动打开浏览器

2 增加less配置

1、npm install less less-loader --save安装less相关依赖模块

2、运行npm run eject 将webpack的配置暴露出来

3、修改webpack.config.js的webpack配置文件

增加less匹配

```

        const lessRegex =/\.less$/; // 新增less配置

        const lessModuleRegex =/\.module\.less$/; // 新增less配置，这个其实不配置也行

```

在rules配置项中增加less 配置(在sass配置后增加以下代码即可)

```

//#region 开始配置less

      {

test: lessRegex,

        exclude: sassModuleRegex,

        use:getStyleLoaders(

{

importLoaders:2,

              sourceMap: isEnvProduction && shouldUseSourceMap,

            },

            'less-loader'

        ),

        // Don't consider CSS imports dead code even if the

// containing package claims to have no side effects.

// Remove this when webpack adds a warning or an error for this.

// See https://github.com/webpack/webpack/issues/6571

        sideEffects:true,

      },

      // Adds support for CSS Modules, but using SASS

// using the extension .module.scss or .module.sass

      {

test: lessModuleRegex,

        use:getStyleLoaders(

{

importLoaders:2,

              sourceMap: isEnvProduction && shouldUseSourceMap,

              modules:true,

              getLocalIdent:getCSSModuleLocalIdent,

            },

            'less-loader'

        ),

      },

//#endregion 结束配置less

```

3 关闭eslint提示

将下面部分代码注释即可

```

{

test: /\.(js|mjs|jsx|ts|tsx)$/,

enforce: 'pre',

use: [

{

options: {

cache: true,

formatter: require.resolve('react-dev-utils/eslintFormatter'),

eslintPath: require.resolve('eslint'),

resolvePluginsRelativeTo: __dirname,

},

loader: require.resolve('eslint-loader'),

},

],

include: paths.appSrc,

}

```

如图