rollup打包vue文件报错[!] (plugin commonjs--resolver) RollupError:xxxx,src/test.vue?vue&type=template&id=0f

rollup打包vue文件报错，如上图。
rollup.config.dev.js中已经配置了解析vue相关插件，但是还是报错
报错原因及解决方案
plugin有序，插件引入顺序有误，vue插件需要放到commonjs插件之前。

vue相关插件

• rollup-plugin-vue
• @vue/compiler-sfc
• rollup-plugin-postcss
• sass

相关配置文件完整代码如下：
rollup.config.dev.js

const path = require('path'); // 引入path模块
const resolve = require('@rollup/plugin-node-resolve'); // 告诉 Rollup 如何查找外部模块
const commonjs = require('@rollup/plugin-commonjs'); // 将CommonJS模块转换为 ES2015 供 Rollup 处理
const babel = require('@rollup/plugin-babel'); // rollup 的 babel 插件，ES6转ES5
const json = require('@rollup/plugin-json'); // rollup 的 json 插件，读取json文件数据
const vue = require('rollup-plugin-vue'); // rollup 的 vue 插件，处理vue文件
const postcss = require('rollup-plugin-postcss'); // rollup 的 postcss 插件，处理css文件
// const terser = require('@rollup/plugin-terser'); // 压缩打包后的文件

const inputPath = path.resolve(__dirname, 'src/index.js'); // 入口文件地址
const outputUmdPath = path.resolve(__dirname, 'dist/bundle.js'); // umd格式打包后文件地址
const outputEsPath = path.resolve(__dirname, 'dist/bundle.es.js'); // es格式打包后文件地址
const outputCjsPath = path.resolve(__dirname, 'dist/bundle.cjs.js'); // cjs格式打包后文件地址


module.exports ={
    input: inputPath, // 入口文件
    output: [{ // 输出文件
        file: outputUmdPath, // umd格式打包后文件地址
        format: 'umd', // umd格式
        name: 'bundle', // 打包后的全局变量名
        globals: {
            vue: 'Vue'
        }
    },{
        file: outputEsPath,
        format: 'es',
        name: 'bundle',
        globals: {
            vue: 'Vue'
        }
    },{
        file: outputCjsPath,
        format: 'cjs',
        name: 'bundle',
        globals: {
            vue: 'Vue'
        }
    }],
    plugins: [
        vue(), // 处理vue文件
        resolve({
            extensions: ['.js', '.jsx', '.json', '.vue']
        }), // 告诉 Rollup 如何查找外部模块
        commonjs(), // 将CommonJS模块转换为 ES2015 供 Rollup 处理
        babel({
            exclude: 'node_modules/**', // 排除node_modules下的文件
            babelHelpers: 'runtime', // 配置runtime，不设置会报错
        }), // rollup 的 babel 插件，ES6转ES5
        json(), // rollup 的 json 插件，读取json文件数据
        postcss({
            extract: true, // 提取css
            minimize: true, // 压缩css
            plugins: [] // postcss插件
        }), // 处理css文件
        // terser() // 压缩打包后的文件
    ],
    external: ['vue'] // 告诉 Rollup 不要将此vue打包，而作为外部依赖
};

package.json

{
  "name": "cx-vue-datav",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "dev": "rollup -w -c rollup.config.dev.js",
    "build": "rollup -c rollup.config.prod.js"
  },
  "author": "jieyucx",
  "license": "ISC",
  "devDependencies": {
    "@babel/core": "^7.23.0",
    "@babel/plugin-external-helpers": "^7.22.5",
    "@babel/plugin-transform-runtime": "^7.22.15",
    "@babel/preset-env": "^7.22.20",
    "@rollup/plugin-babel": "^6.0.4",
    "@rollup/plugin-commonjs": "^25.0.5",
    "@rollup/plugin-json": "^6.0.1",
    "@rollup/plugin-node-resolve": "^15.2.2",
    "@rollup/plugin-terser": "^0.4.4",
    "@vue/compiler-sfc": "^3.3.4",
    "rollup": "^4.0.2",
    "rollup-plugin-postcss": "^4.0.2",
    "rollup-plugin-vue": "^6.0.0",
    "sass": "^1.69.0"
  },
  "dependencies": {
    "@babel/runtime": "^7.23.1",
    "@babel/runtime-corejs3": "^7.23.1"
  }
}