Taro项目 运行抛出警告chunk common [mini-css-extract-plugin] Conflicting order between:

运行项目的时候会抛出一些警告

chunk common [mini-css-extract-plugin]
Conflicting order between:
 * css ./node_modules/@tarojs/mini-runner/node_modules/css-loader/dist/cjs.js??ref--5-oneOf-1-1!./node_modules/postcss-loader/src??postcss!./node_modules/@tarojs/mini-runner/node_modules/resolve-url-loader!./node_modules/sass-loader/dist/cjs.js??ref--5-oneOf-1-4!./src/components/checkbox/index.scss
 * css ./node_modules/@tarojs/mini-runner/node_modules/css-loader/dist/cjs.js??ref--5-oneOf-1-1!./node_modules/postcss-loader/src??postcss!./node_modules/@tarojs/mini-runner/node_modules/resolve-url-loader!./node_modules/sass-loader/dist/cjs.js??ref--5-oneOf-1-4!./src/components/AccountDetail/index.scss

首先我们要明白抛出的这些警告是什么意思？
首先我们看到这些警告是在build的时候由 mini-css-extract-plugin 这个插件抛出的，那么这个插件有什么作用呢 这个插件主要是将CSS样式抽离出来到一个文件内，它的特点是不会重复编译CSS文件
所以引起这些警告的原因就是我们在项目中引用组件的时候引用的顺序不同，导致该插件遇到了编译过的CSS文件，所以才会抛出警告。

举个例子

页面pageA中引入的componentA和componentB
import A from '@/components/A';
import B from '@/components/B';

页面pageB中也引入的componentA和componentB， 但是组件A和组件B的引入顺序和pageA中的不一样，这个时候就会抛出警告
import B from '@/components/B';
import A from '@/components/A';

解决办法

尽量保持组件的引用顺序是一致的