couldn't fulfill desired order of chunk group(s)

[zzq0324]

NutUI scenes（nutui 场景）

小程序（@nutui/nutui-taro）

NutUI-vue version（nutui-vue 版本）

4.0.1

Vue version（vue 版本）

3.2.47

Operating environment（运行环境）

dev:weapp

Citation method（引用方式）

npm

Node version（node 版本）

17.8.0

Browser and its version（浏览器及其版本）

Chrome 106

System and its version（系统及其版本）

MacOS 12.6

Taro environmental information（taro 环境信息）

👽 Taro v3.6.1

Taro CLI 3.6.1 environment info:
System:
OS: macOS 12.2
Shell: 5.8 - /bin/zsh
Binaries:
Node: 17.8.0 - /opt/homebrew/bin/node
npm: 8.5.5 - /opt/homebrew/bin/npm
npmPackages:
@tarojs/cli: 3.6.1 => 3.6.1
@tarojs/components: 3.6.1 => 3.6.1
@tarojs/helper: 3.6.1 => 3.6.1
@tarojs/plugin-framework-vue3: 3.6.1 => 3.6.1
@tarojs/plugin-html: 3.6.1 => 3.6.1
@tarojs/plugin-platform-alipay: 3.6.1 => 3.6.1
@tarojs/plugin-platform-h5: 3.6.1 => 3.6.1
@tarojs/plugin-platform-jd: 3.6.1 => 3.6.1
@tarojs/plugin-platform-qq: 3.6.1 => 3.6.1
@tarojs/plugin-platform-swan: 3.6.1 => 3.6.1
@tarojs/plugin-platform-tt: 3.6.1 => 3.6.1
@tarojs/plugin-platform-weapp: 3.6.1 => 3.6.1
@tarojs/runtime: 3.6.1 => 3.6.1
@tarojs/shared: 3.6.1 => 3.6.1
@tarojs/taro: 3.6.1 => 3.6.1
@tarojs/webpack5-runner: 3.6.1 => 3.6.1
babel-preset-taro: 3.6.1 => 3.6.1
eslint-config-taro: 3.6.1 => 3.6.1

Reproduction link（重现链接）

无

Steps to reproduce（重现步骤）

有2个页面使用了nutui，结果出现告警，虽然不影响使用，但是看着别扭。

What is expected?（期望的结果是什么？）

能够不告警

What is actually happening?（实际的结果是什么？）

⚠️ Warnings:

Error: chunk common [mini-css-extract-plugin]
Conflicting order. Following module has been added:
 * css ./node_modules/.pnpm/css-loader@6.7.3/dist/cjs.js??clonedRuleSet-4.use[1]!./node_modules/.pnpm/postcss-loader@7.0.2/dist/cjs.js??clonedRuleSet-4.use[2]!./node_modules/.pnpm/resolve-url-loader@4.0.0/index.js!./node_modules/.pnpm/sass-loader@12.4.0/dist/cjs.js??clonedRuleSet-4.use[4]!./node_modules/.pnpm/@nutui/nutui-taro@4.0.1/dist/packages/overlay/index.scss
despite it was not able to fulfill desired ordering with these modules:
 * css ./node_modules/.pnpm/css-loader@6.7.3/dist/cjs.js??clonedRuleSet-4.use[1]!./node_modules/.pnpm/postcss-loader@7.0.2/dist/cjs.js??clonedRuleSet-4.use[2]!./node_modules/.pnpm/resolve-url-loader@4.0.0/index.js!./node_modules/.pnpm/sass-loader@12.4.0/dist/cjs.js??clonedRuleSet-4.use[4]!./node_modules/.pnpm/@nutui/nutui-taro@4.0.1/dist/packages/button/index.scss
   - couldn't fulfill desired order of chunk group(s) pages/bill-detail/index
   - while fulfilling desired order of chunk group(s) pages/index/index
    at Array.forEach (<anonymous>)

Error: chunk common [mini-css-extract-plugin]
Conflicting order. Following module has been added:
 * css ./node_modules/.pnpm/css-loader@6.7.3/dist/cjs.js??clonedRuleSet-4.use[1]!./node_modules/.pnpm/postcss-loader@7.0.2/dist/cjs.js??clonedRuleSet-4.use[2]!./node_modules/.pnpm/resolve-url-loader@4.0.0/index.js!./node_modules/.pnpm/sass-loader@12.4.0/dist/cjs.js??clonedRuleSet-4.use[4]!./node_modules/.pnpm/@nutui/nutui-taro@4.0.1/dist/packages/popup/index.scss
despite it was not able to fulfill desired ordering with these modules:
 * css ./node_modules/.pnpm/css-loader@6.7.3/dist/cjs.js??clonedRuleSet-4.use[1]!./node_modules/.pnpm/postcss-loader@7.0.2/dist/cjs.js??clonedRuleSet-4.use[2]!./node_modules/.pnpm/resolve-url-loader@4.0.0/index.js!./node_modules/.pnpm/sass-loader@12.4.0/dist/cjs.js??clonedRuleSet-4.use[4]!./node_modules/.pnpm/@nutui/nutui-taro@4.0.1/dist/packages/button/index.scss
   - couldn't fulfill desired order of chunk group(s) pages/bill-detail/index
   - while fulfilling desired order of chunk group(s) pages/index/index
    at Array.forEach (<anonymous>)

Error: chunk common [mini-css-extract-plugin]
Conflicting order. Following module has been added:
 * css ./node_modules/.pnpm/css-loader@6.7.3/dist/cjs.js??clonedRuleSet-4.use[1]!./node_modules/.pnpm/postcss-loader@7.0.2/dist/cjs.js??clonedRuleSet-4.use[2]!./node_modules/.pnpm/resolve-url-loader@4.0.0/index.js!./node_modules/.pnpm/sass-loader@12.4.0/dist/cjs.js??clonedRuleSet-4.use[4]!./node_modules/.pnpm/@nutui/nutui-taro@4.0.1/dist/packages/button/index.scss
despite it was not able to fulfill desired ordering with these modules:
 * css ./node_modules/.pnpm/css-loader@6.7.3/dist/cjs.js??clonedRuleSet-4.use[1]!./node_modules/.pnpm/postcss-loader@7.0.2/dist/cjs.js??clonedRuleSet-4.use[2]!./node_modules/.pnpm/resolve-url-loader@4.0.0/index.js!./node_modules/.pnpm/sass-loader@12.4.0/dist/cjs.js??clonedRuleSet-4.use[4]!./node_modules/.pnpm/@nutui/nutui-taro@4.0.1/dist/packages/cell/index.scss
   - couldn't fulfill desired order of chunk group(s) pages/index/index
   - while fulfilling desired order of chunk group(s) pages/bill-detail/index
    at Array.forEach (<anonymous>)

Error: chunk common [mini-css-extract-plugin]
Conflicting order. Following module has been added:
 * css ./node_modules/.pnpm/css-loader@6.7.3/dist/cjs.js??clonedRuleSet-4.use[1]!./node_modules/.pnpm/postcss-loader@7.0.2/dist/cjs.js??clonedRuleSet-4.use[2]!./node_modules/.pnpm/resolve-url-loader@4.0.0/index.js!./node_modules/.pnpm/sass-loader@12.4.0/dist/cjs.js??clonedRuleSet-4.use[4]!./node_modules/.pnpm/@nutui/nutui-taro@4.0.1/dist/packages/dialog/index.scss
despite it was not able to fulfill desired ordering with these modules:
 * css ./node_modules/.pnpm/css-loader@6.7.3/dist/cjs.js??clonedRuleSet-4.use[1]!./node_modules/.pnpm/postcss-loader@7.0.2/dist/cjs.js??clonedRuleSet-4.use[2]!./node_modules/.pnpm/resolve-url-loader@4.0.0/index.js!./node_modules/.pnpm/sass-loader@12.4.0/dist/cjs.js??clonedRuleSet-4.use[4]!./node_modules/.pnpm/@nutui/nutui-taro@4.0.1/dist/packages/cell/index.scss
   - couldn't fulfill desired order of chunk group(s) pages/index/index
   - while fulfilling desired order of chunk group(s) pages/bill-detail/index
    at Array.forEach (<anonymous>)

Error: chunk common [mini-css-extract-plugin]
Conflicting order. Following module has been added:
 * css ./node_modules/.pnpm/css-loader@6.7.3/dist/cjs.js??clonedRuleSet-4.use[1]!./node_modules/.pnpm/postcss-loader@7.0.2/dist/cjs.js??clonedRuleSet-4.use[2]!./node_modules/.pnpm/resolve-url-loader@4.0.0/index.js!./node_modules/.pnpm/sass-loader@12.4.0/dist/cjs.js??clonedRuleSet-4.use[4]!./node_modules/.pnpm/@nutui/nutui-taro@4.0.1/dist/packages/cell/index.scss
despite it was not able to fulfill desired ordering with these modules:
 * css ./node_modules/.pnpm/css-loader@6.7.3/dist/cjs.js??clonedRuleSet-4.use[1]!./node_modules/.pnpm/postcss-loader@7.0.2/dist/cjs.js??clonedRuleSet-4.use[2]!./node_modules/.pnpm/resolve-url-loader@4.0.0/index.js!./node_modules/.pnpm/sass-loader@12.4.0/dist/cjs.js??clonedRuleSet-4.use[4]!./node_modules/.pnpm/@nutui/nutui-taro@4.0.1/dist/packages/divider/index.scss
   - couldn't fulfill desired order of chunk group(s) pages/bill-detail/index
   - while fulfilling desired order of chunk group(s) pages/index/index
    at Array.forEach (<anonymous>)

Error: chunk common [mini-css-extract-plugin]
Conflicting order. Following module has been added:
 * css ./node_modules/.pnpm/css-loader@6.7.3/dist/cjs.js??clonedRuleSet-4.use[1]!./node_modules/.pnpm/postcss-loader@7.0.2/dist/cjs.js??clonedRuleSet-4.use[2]!./node_modules/.pnpm/resolve-url-loader@4.0.0/index.js!./node_modules/.pnpm/sass-loader@12.4.0/dist/cjs.js??clonedRuleSet-4.use[4]!./node_modules/.pnpm/@nutui/nutui-taro@4.0.1/dist/packages/avatargroup/index.scss
despite it was not able to fulfill desired ordering with these modules:
 * css ./node_modules/.pnpm/css-loader@6.7.3/dist/cjs.js??clonedRuleSet-4.use[1]!./node_modules/.pnpm/postcss-loader@7.0.2/dist/cjs.js??clonedRuleSet-4.use[2]!./node_modules/.pnpm/resolve-url-loader@4.0.0/index.js!./node_modules/.pnpm/sass-loader@12.4.0/dist/cjs.js??clonedRuleSet-4.use[4]!./node_modules/.pnpm/@nutui/nutui-taro@4.0.1/dist/packages/col/index.scss
   - couldn't fulfill desired order of chunk group(s) pages/index/index
   - while fulfilling desired order of chunk group(s) pages/bill-detail/index
    at Array.forEach (<anonymous>)

Error: chunk common [mini-css-extract-plugin]
Conflicting order. Following module has been added:
 * css ./node_modules/.pnpm/css-loader@6.7.3/dist/cjs.js??clonedRuleSet-4.use[1]!./node_modules/.pnpm/postcss-loader@7.0.2/dist/cjs.js??clonedRuleSet-4.use[2]!./node_modules/.pnpm/resolve-url-loader@4.0.0/index.js!./node_modules/.pnpm/sass-loader@12.4.0/dist/cjs.js??clonedRuleSet-4.use[4]!./node_modules/.pnpm/@nutui/nutui-taro@4.0.1/dist/packages/col/index.scss
despite it was not able to fulfill desired ordering with these modules:
 * css ./node_modules/.pnpm/css-loader@6.7.3/dist/cjs.js??clonedRuleSet-4.use[1]!./node_modules/.pnpm/postcss-loader@7.0.2/dist/cjs.js??clonedRuleSet-4.use[2]!./node_modules/.pnpm/resolve-url-loader@4.0.0/index.js!./node_modules/.pnpm/sass-loader@12.4.0/dist/cjs.js??clonedRuleSet-4.use[4]!./node_modules/.pnpm/@nutui/nutui-taro@4.0.1/dist/packages/avatar/index.scss
   - couldn't fulfill desired order of chunk group(s) pages/bill-detail/index
   - while fulfilling desired order of chunk group(s) pages/index/index
    at Array.forEach (<anonymous>)

[yangyankang]

在component.d.ts中把组件顺序调整下就好了
参考我的可以看下，哪个是第一个报错哪个就放前面
// generated by unplugin-vue-components
// We suggest you to commit this file into source control
// Read more: vuejs/core#3399
import '@vue/runtime-core'

export {}

declare module '@vue/runtime-core' {
export interface GlobalComponents {
NavBar: typeof import('./src/components/NavBar.vue')['default']
NumberDisplay: typeof import('./src/components/NumberDisplay.vue')['default']
NumberSubmit: typeof import('./src/components/NumberSubmit.vue')['default']
NutButton: typeof import('@nutui/nutui-taro')['Button']
NutCalendar: typeof import('@nutui/nutui-taro')['Calendar']
NutCell: typeof import('@nutui/nutui-taro')['Cell']
NutCol: typeof import('@nutui/nutui-taro')['Col']
NutCollapse: typeof import('@nutui/nutui-taro')['Collapse']
NutCollapseItem: typeof import('@nutui/nutui-taro')['CollapseItem']
NutDialog: typeof import('@nutui/nutui-taro')['Dialog']
NutEmpty: typeof import('@nutui/nutui-taro')['Empty']
NutForm: typeof import('@nutui/nutui-taro')['Form']
NutFormItem: typeof import('@nutui/nutui-taro')['FormItem']
NutInput: typeof import('@nutui/nutui-taro')['Input']
NutPicker: typeof import('@nutui/nutui-taro')['Picker']
NutPopup: typeof import('@nutui/nutui-taro')['Popup']
NutProgress: typeof import('@nutui/nutui-taro')['Progress']
NutRadio: typeof import('@nutui/nutui-taro')['Radio']
NutRadioGroup: typeof import('@nutui/nutui-taro')['RadioGroup']
NutRow: typeof import('@nutui/nutui-taro')['Row']
NutTable: typeof import('@nutui/nutui-taro')['Table']
NutTabPane: typeof import('@nutui/nutui-taro')['TabPane']
NutTabs: typeof import('@nutui/nutui-taro')['Tabs']
NutTag: typeof import('@nutui/nutui-taro')['Tag']
SelectItem: typeof import('./src/components/SelectItem.vue')['default']
}
}

[yangyankang]

把button的放在第一个

[cocoonnu]

我也是这个问题，请问你解决了吗？目前找到的方法是在 config/index.js 中的 mini 里面添加

miniCssExtractPluginOption: {
    ignoreOrder: true,
}        

但是只是治标不治本，不会显示报错了而已，如果后面还遇到问题再把它注释掉

[eiinu]

复现场景不明确，原因还在排查，测试发现除了 Vue 版本之外，React 版也有过类似的问题反馈。

[bo-tea]

同遇到了，突然遇到这个问题的，之前好好的，在一次代码大范围回退后重新打包突然就开始报这个警告
查了下说除了编译速度可能会影响好像其他的还好 暂时用ignoreOrder: true这个方法先屏蔽了

[hisunny520]

@yangyankang 这个文件是自动生成的，调整以后编译就还原了，你的这样解决了？

[Ttou]

确实有这个问题

[XIAOSHIDECUICAN]

我在src\pages\index\index.vue文件里这样写

<view class="index">
    <nut-row>
      <nut-col>
        <nut-cell-group>
          <nut-cell> </nut-cell>
        </nut-cell-group>
      </nut-col>
    </nut-row>
  </view>

在src\pages\my\index.vue文件里这样写

<template>
  <view class="index">
    <nut-row>
      <nut-col :span="7" v-if="isProperty"> </nut-col>
    </nut-row>
    <nut-cell-group>
      <nut-cell> </nut-cell>
    </nut-cell-group>
  </view>
</template>

src\app.config.ts配置了

pages: ["pages/index/index", "pages/my/index"],

在环境nutui-demo/nutui4-vue/taro下运行npm run dev:weapp这个命令得到下面的结果

 Warinings: 

Error: chunk common [mini-css-extract-plugin]
Conflicting order. Following module has been added:
 * css ./node_modules/@tarojs/webpack5-runner/node_modules/css-loader/dist/cjs.js??clonedRuleSet-4.use[1]!./node_modules/@tarojs/webpack5-runner/node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-4.use[2]!./node_modules/resolve-url-loader/index.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-4.use[4]!./node_modules/@nutui/nutui-taro/dist/packages/row/index.scss
despite it was not able to fulfill desired ordering with these modules:
 * css ./node_modules/@tarojs/webpack5-runner/node_modules/css-loader/dist/cjs.js??clonedRuleSet-4.use[1]!./node_modules/@tarojs/webpack5-runner/node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-4.use[2]!./node_modules/resolve-url-loader/index.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-4.use[4]!./node_modules/@nutui/nutui-taro/dist/packages/cell/index.scss
   - couldn't fulfill desired order of chunk group(s) pages/my/index
   - while fulfilling desired order of chunk group(s) pages/index/index
 * css ./node_modules/@tarojs/webpack5-runner/node_modules/css-loader/dist/cjs.js??clonedRuleSet-4.use[1]!./node_modules/@tarojs/webpack5-runner/node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-4.use[2]!./node_modules/resolve-url-loader/index.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-4.use[4]!./node_modules/@nutui/nutui-taro/dist/packages/cellgroup/index.scss
   - couldn't fulfill desired order of chunk group(s) pages/my/index
   - while fulfilling desired order of chunk group(s) pages/index/index
    at Array.forEach (<anonymous>)

Error: chunk common [mini-css-extract-plugin]
Conflicting order. Following module has been added:
 * css ./node_modules/@tarojs/webpack5-runner/node_modules/css-loader/dist/cjs.js??clonedRuleSet-4.use[1]!./node_modules/@tarojs/webpack5-runner/node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-4.use[2]!./node_modules/resolve-url-loader/index.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-4.use[4]!./node_modules/@nutui/nutui-taro/dist/packages/cellgroup/index.scss
despite it was not able to fulfill desired ordering with these modules:
 * css ./node_modules/@tarojs/webpack5-runner/node_modules/css-loader/dist/cjs.js??clonedRuleSet-4.use[1]!./node_modules/@tarojs/webpack5-runner/node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-4.use[2]!./node_modules/resolve-url-loader/index.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-4.use[4]!./node_modules/@nutui/nutui-taro/dist/packages/col/index.scss
   - couldn't fulfill desired order of chunk group(s) pages/index/index
   - while fulfilling desired order of chunk group(s) pages/my/index
    at Array.forEach (<anonymous>)

Error: chunk common [mini-css-extract-plugin]
Conflicting order. Following module has been added:
 * css ./node_modules/@tarojs/webpack5-runner/node_modules/css-loader/dist/cjs.js??clonedRuleSet-4.use[1]!./node_modules/@tarojs/webpack5-runner/node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-4.use[2]!./node_modules/resolve-url-loader/index.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-4.use[4]!./node_modules/@nutui/nutui-taro/dist/packages/col/index.scss
despite it was not able to fulfill desired ordering with these modules:
 * css ./node_modules/@tarojs/webpack5-runner/node_modules/css-loader/dist/cjs.js??clonedRuleSet-4.use[1]!./node_modules/@tarojs/webpack5-runner/node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-4.use[2]!./node_modules/resolve-url-loader/index.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-4.use[4]!./node_modules/@nutui/nutui-taro/dist/packages/cell/index.scss
   - couldn't fulfill desired order of chunk group(s) pages/my/index
   - while fulfilling desired order of chunk group(s) pages/index/index
    at Array.forEach (<anonymous>)

[hisunny520]

@XIAOSHIDECUICAN 无解，官方一直没有解决方法，只能注释掉

[https://github.com/jdf2e/nutui/issues/2126#issuecomment-1506951569](https://github.com/jdf2e/nutui/issues/2126#issuecomment-1506951569)

我也是这个问题，请问你解决了吗？目前找到的方法是在 config/index.js 中的 mini 里面添加

miniCssExtractPluginOption: {
    ignoreOrder: true,
}        
但是只是治标不治本，不会显示报错了而已，如果后面还遇到问题再把它注释掉

[eiinu]

在当前的自动按需引入（与手动引入组件作对比）的方式下，组件样式的引入顺序是由 unplugin-vue-components 插件根据开发者编写的模板代码生成的。

组件库本身无法控制，开发者调整代码结构也不现实。

建议遇到这种报错时开启 ignoreOrder，NutUI 组件样式的引入顺序不会影响最终表现。

#2356 (comment)

[wenghaoping]

一直写的好好的,突然有一天开始报这个错,真的无语,还能先忽略了.

[hooliy]

react 下写的好好的，突然就出现这个错误了

[eiinu]

react 下写的好好的，突然就出现这个错误了

vue 的组件是自动导入的，没法控制顺序。
react 的组件导入都是手动写的，自行调整一下 import 的顺序，应该可以解决？