Taro Error: chunk common [mini-css-extract-plugin] Conflicting order between: ……

Error Messages:

chunk common [mini-css-extract-plugin]
Conflicting order between:
css ./node_modules/css-loader/dist/cjs.js??ref–2-oneOf-0-1!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/@tarojs/mini-runner/node_modules/postcss-loader/dist/cjs.js??ref–2-oneOf-0-2!./node_modules/@tarojs/mini-runner/node_modules/less-loader/dist/cjs.js??ref–2-oneOf-0-3!./node_modules/vue-loader/lib??vue-loader-options!./src/components/place-holder/index.vue?vue&type=style&index=0&lang=less&css ./node_modules/css-loader/dist/cjs.js??ref–2-oneOf-0-1!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/@tarojs/mini-runner/node_modules/postcss-loader/dist/cjs.js??ref–2-oneOf-0-2!./node_modules/@tarojs/mini-runner/node_modules/less-loader/dist/cjs.js??ref–2-oneOf-0-3!./node_modules/vue-loader/lib??vue-loader-options!./src/components/popup-scroll/index.vue?vue&type=style&index=0&lang=less&

 

Solution: It took a long time to find out that it was caused by the wrong order of introduction of components in a file, the pit.
Error example

<template>
	<view>
			<B/>
			<A/>
	</view>
</template>
<script>
		import A from "./components/a";
		import B from "../components/b";
</script>

Correct example

<template>
	<view>
			<B/>
			<A/>
	</view>
</template>

<script>
		import B from "../components/b";
		import A from "./components/a";
</script>

Read More: