jeecgboot安装webpack报错

小灰灰 2022-11-14 14:58 399阅读 0赞

# jeecgboot安装webpack时报错 #

npm install webpack -g // 全局安装
    npm install webpack --save-dev // 项目内安装

错1：  
TypeError: Class extends value undefined is not a constructor or null

$ vue-cli-service build
     
    ⠋  Building for production... ERROR  TypeError: Class extends value undefined is not a constructor or null
    TypeError: Class extends value undefined is not a constructor or null
        at Object.<anonymous> (/root/deploy/ui/node_modules/mini-css-extract-plugin/dist/CssDependency.js:12:46)
        at Module._compile (module.js:652:30)
        at Object.Module._extensions..js (module.js:663:10)
        at Module.load (module.js:565:32)
        at tryModuleLoad (module.js:505:12)
        at Function.Module._load (module.js:497:3)
        at Module.require (module.js:596:17)
        at require (internal/module.js:11:18)
        at Object.<anonymous> (/root/deploy/ui/node_modules/mini-css-extract-plugin/dist/index.js:12:45)
        at Module._compile (module.js:652:30)
        at Object.Module._extensions..js (module.js:663:10)
        at Module.load (module.js:565:32)
        at tryModuleLoad (module.js:505:12)
        at Function.Module._load (module.js:497:3)
        at Module.require (module.js:596:17)
        at require (internal/module.js:11:18)

# 原因：（个人猜测） #

jeecg支持的webpack版本问题，直接安装时版本高

删除webpack，重新装以前的版本。
    npm uninstall webpack
    npm install webpack@^4.0.0 --save-dev

错2：  
. ERROR Error: Rule can only have one resource source (provided resource and test + include + exclude) in

Building for production... ERROR  Error: Rule can only have one resource source (provided resource and test + include + exclude) in { 
       "exclude": [
               null
                 ],
           "use": [
                  { 
          "loader": "cache-loader",
          "options": { 
            "cacheDirectory": "D:\\vueProject\\DaYuanShuai-ability-master\\ability\\ant-design-vue-cssc\\node_modules\\.cache\\babel-loader",
            "cacheIdentifier": "276c622c"
                 },
          "ident": "clonedRuleSet-38[0].rules[0].use[0]"
                 },
                  { 
          "loader": "thread-loader",
          "options": "undefined",
          "ident": "undefined"
                 },
                  { 
          "loader": "babel-loader",
          "options": "undefined",
          "ident": "undefined"
                  }
                  ]
                  }
    Error: Rule can only have one resource source (provided resource and test + include + exclude) in { 
      "exclude": [
        null
      ],
      "use": [
        { 
          "loader": "cache-loader",
          "options": { 
            "cacheDirectory": "D:\\vueProject\\DaYuanShuai-ability-master\\ability\\ant-design-vue-cssc\\node_modules\\.cache\\babel-loader",
            "cacheIdentifier": "276c622c"
          },
          "ident": "clonedRuleSet-38[0].rules[0].use[0]"
        },
        { 
          "loader": "thread-loader",
          "options": "undefined",
          "ident": "undefined"
        },
        { 
          "loader": "babel-loader",
          "options": "undefined",
          "ident": "undefined"
        }
      ]
    }

# 原因：（个人猜测） #

jeecg支持的webpack版本问题，4.0版本低了

# 最后的解决方法 #

在安装4.0 版本后又安装一次npm install webpack --save-dev

"webpack": "^4.46.0"

npm run build 才运行成功

# 方法 #

使用4.46.0版本

// An highlighted block
    npm install webpack -g
    npm install webpack@^4.46.0 --save-dev

## 以上时个人推测，原理也不是很清楚，如果有大佬明白原理或者更好的方法，欢迎留言 ##