Compiled with problems: × ERROR in ./node_modules/agent-base/dist/helpers.js 39:26-41 Module not found: Error: Can't resolve 'http' in '/node_modules/agent-base/dist' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "http": require.resolve("stream-http") }' - install 'stream-http' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "http": false } ERROR in ./node_modules/agent-base/dist/helpers.js 40:27-43 Module not found: Error: Can't resolve 'https' in '/node_modules/agent-base/dist' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "https": require.resolve("https-browserify") }' - install 'https-browserify' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "https": false } ERROR in ./node_modules/agent-base/dist/index.js 44:25-39 Module not found: Error: Can't resolve 'net' in '/node_modules/agent-base/dist' ERROR in ./node_modules/agent-base/dist/index.js 45:26-41 Module not found: Error: Can't resolve 'http' in '/node_modules/agent-base/dist' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "http": require.resolve("stream-http") }' - install 'stream-http' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "http": false } ERROR in ./node_modules/agent-base/dist/index.js 46:16-32 Module not found: Error: Can't resolve 'https' in '/node_modules/agent-base/dist' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "https": require.resolve("https-browserify") }' - install 'https-browserify' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "https": false } ERROR in ./node_modules/http-proxy-agent/dist/index.js 43:25-39 Module not found: Error: Can't resolve 'net' in '/node_modules/http-proxy-agent/dist' ERROR in ./node_modules/http-proxy-agent/dist/index.js 44:25-39 Module not found: Error: Can't resolve 'tls' in '/node_modules/http-proxy-agent/dist' ERROR in ./node_modules/https-proxy-agent/dist/index.js 44:25-39 Module not found: Error: Can't resolve 'net' in '/node_modules/https-proxy-agent/dist' ERROR in ./node_modules/https-proxy-agent/dist/index.js 45:25-39 Module not found: Error: Can't resolve 'tls' in '/node_modules/https-proxy-agent/dist' ERROR in ./node_modules/jsdom/lib/api.js 6:13-28 Module not found: Error: Can't resolve 'path' in '/node_modules/jsdom/lib' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "path": require.resolve("path-browserify") }' - install 'path-browserify' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "path": false } ERROR in ./node_modules/jsdom/lib/api.js 7:11-33 Module not found: Error: Can't resolve 'fs' in '/node_modules/jsdom/lib' ERROR in ./node_modules/jsdom/lib/api.js 8:11-24 Module not found: Error: Can't resolve 'vm' in '/node_modules/jsdom/lib' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "vm": require.resolve("vm-browserify") }' - install 'vm-browserify' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "vm": false } ERROR in ./node_modules/jsdom/lib/jsdom/browser/Window.js 13:11-24 Module not found: Error: Can't resolve 'vm' in '/node_modules/jsdom/lib/jsdom/browser' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "vm": require.resolve("vm-browserify") }' - install 'vm-browserify' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "vm": false } ERROR in ./node_modules/jsdom/lib/jsdom/browser/resources/resource-loader.js 4:11-24 Module not found: Error: Can't resolve 'fs' in '/node_modules/jsdom/lib/jsdom/browser/resources' ERROR in ./node_modules/jsdom/lib/jsdom/living/crypto/Crypto-impl.js 4:19-36 Module not found: Error: Can't resolve 'crypto' in '/node_modules/jsdom/lib/jsdom/living/crypto' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "crypto": require.resolve("crypto-browserify") }' - install 'crypto-browserify' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "crypto": false } ERROR in ./node_modules/jsdom/lib/jsdom/living/helpers/agent-factory.js 3:13-28 Module not found: Error: Can't resolve 'http' in '/node_modules/jsdom/lib/jsdom/living/helpers' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "http": require.resolve("stream-http") }' - install 'stream-http' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "http": false } ERROR in ./node_modules/jsdom/lib/jsdom/living/helpers/agent-factory.js 4:14-30 Module not found: Error: Can't resolve 'https' in '/node_modules/jsdom/lib/jsdom/living/helpers' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "https": require.resolve("https-browserify") }' - install 'https-browserify' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "https": false } ERROR in ./node_modules/jsdom/lib/jsdom/living/helpers/http-request.js 9:13-28 Module not found: Error: Can't resolve 'http' in '/node_modules/jsdom/lib/jsdom/living/helpers' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "http": require.resolve("stream-http") }' - install 'stream-http' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "http": false } ERROR in ./node_modules/jsdom/lib/jsdom/living/helpers/http-request.js 10:14-30 Module not found: Error: Can't resolve 'https' in '/node_modules/jsdom/lib/jsdom/living/helpers' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "https": require.resolve("https-browserify") }' - install 'https-browserify' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "https": false } ERROR in ./node_modules/jsdom/lib/jsdom/living/helpers/http-request.js 13:4-21 Module not found: Error: Can't resolve 'stream' in '/node_modules/jsdom/lib/jsdom/living/helpers' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "stream": require.resolve("stream-browserify") }' - install 'stream-browserify' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "stream": false } ERROR in ./node_modules/jsdom/lib/jsdom/living/helpers/http-request.js 14:13-28 Module not found: Error: Can't resolve 'zlib' in '/node_modules/jsdom/lib/jsdom/living/helpers' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "zlib": require.resolve("browserify-zlib") }' - install 'browserify-zlib' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "zlib": false } ERROR in ./node_modules/jsdom/lib/jsdom/living/navigator/NavigatorConcurrentHardware-impl.js 3:11-24 Module not found: Error: Can't resolve 'os' in '/node_modules/jsdom/lib/jsdom/living/navigator' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "os": require.resolve("os-browserify/browser") }' - install 'os-browserify' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "os": false } ERROR in ./node_modules/jsdom/lib/jsdom/living/nodes/HTMLScriptElement-impl.js 11:11-24 Module not found: Error: Can't resolve 'vm' in '/node_modules/jsdom/lib/jsdom/living/nodes' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "vm": require.resolve("vm-browserify") }' - install 'vm-browserify' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "vm": false } ERROR in ./node_modules/jsdom/lib/jsdom/living/xhr/XMLHttpRequest-impl.js 21:26-54 Module not found: Error: Can't resolve 'http' in '/node_modules/jsdom/lib/jsdom/living/xhr' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "http": require.resolve("stream-http") }' - install 'stream-http' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "http": false } ERROR in ./node_modules/jsdom/lib/jsdom/living/xhr/XMLHttpRequest-impl.js 24:4-28 Module not found: Error: Can't resolve 'child_process' in '/node_modules/jsdom/lib/jsdom/living/xhr' ERROR in ./node_modules/jsdom/lib/jsdom/living/xhr/xhr-utils.js 13:11-24 Module not found: Error: Can't resolve 'fs' in '/node_modules/jsdom/lib/jsdom/living/xhr' ERROR in ./node_modules/@asamuzakjp/css-color/node_modules/lru-cache/dist/commonjs/index.js Module build failed (from ./node_modules/babel-loader/lib/index.js): SyntaxError: /node_modules/@asamuzakjp/css-color/node_modules/lru-cache/dist/commonjs/index.js: Class private methods are not enabled. Please add `@babel/plugin-transform-private-methods` to your configuration. 421 | return this.#keyMap.has(key) ? Infinity : 0; 422 | } > 423 | #initializeTTLTracking() { | ^ 424 | const ttls = new ZeroArray(this.#max); 425 | const starts = new ZeroArray(this.#max); 426 | this.#ttls = ttls; at File.buildCodeFrameError (/node_modules/@babel/core/lib/transformation/file/file.js:193:12) at NodePath.buildCodeFrameError (/node_modules/@babel/traverse/lib/path/index.js:117:21) at shouldTransform (/node_modules/@babel/helper-create-class-features-plugin/lib/features.js:130:29) at PluginPass.Class (/node_modules/@babel/helper-create-class-features-plugin/lib/index.js:112:44) at newFn (/node_modules/@babel/traverse/lib/visitors.js:172:14) at NodePath._call (/node_modules/@babel/traverse/lib/path/context.js:49:20) at NodePath.call (/node_modules/@babel/traverse/lib/path/context.js:39:18) at NodePath.visit (/node_modules/@babel/traverse/lib/path/context.js:88:31) at TraversalContext.visitQueue (/node_modules/@babel/traverse/lib/context.js:90:16) at TraversalContext.visitMultiple (/node_modules/@babel/traverse/lib/context.js:62:17) at TraversalContext.visit (/node_modules/@babel/traverse/lib/context.js:111:19) at traverseNode (/node_modules/@babel/traverse/lib/traverse-node.js:22:17) at NodePath.visit (/node_modules/@babel/traverse/lib/path/context.js:94:52) at TraversalContext.visitQueue (/node_modules/@babel/traverse/lib/context.js:90:16) at TraversalContext.visitSingle (/node_modules/@babel/traverse/lib/context.js:66:19) at TraversalContext.visit (/node_modules/@babel/traverse/lib/context.js:113:19) at traverseNode (/node_modules/@babel/traverse/lib/traverse-node.js:22:17) at traverse (/node_modules/@babel/traverse/lib/index.js:53:34) at transformFile (/node_modules/@babel/core/lib/transformation/index.js:80:31) at transformFile.next (<anonymous>) at run (/node_modules/@babel/core/lib/transformation/index.js:25:12) at run.next (<anonymous>) at transform (/node_modules/@babel/core/lib/transform.js:22:33) at transform.next (<anonymous>) at step (/node_modules/gensync/index.js:261:32) at /node_modules/gensync/index.js:273:13 at async.call.result.err.err (/node_modules/gensync/index.js:223:11) ERROR in ./node_modules/axios/lib/utils.js 14:0-28 Module not found: Error: Can't resolve 'crypto' in '/node_modules/axios/lib' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "crypto": require.resolve("crypto-browserify") }' - install 'crypto-browserify' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "crypto": false }
解决办法: 删除node_modules 文件夹和package-lock.json 文件, 输入npm install
vue.config.js 配置如下
const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
transpileDependencies: true,
// configureWebpack: {
// resolve: {
// fallback: {
// crypto: require.resolve('crypto-browserify'),
// // http: require.resolve("stream-http") },
// // https: require.resolve("https-browserify")
// http: false,
// https: false
// "path": false ,
// 'crypto': require.resolve('crypto-browserify'),
// 'stream': require.resolve('stream-browserify'),
// 'assert': require.resolve('assert'),
// 'http': require.resolve('stream-http'),
// 'https': require.resolve('https-browserify'),
// 'os': require.resolve('os-browserify/browser'),
// 'zlib': require.resolve('browserify-zlib'),
// 'vm': require.resolve("vm-browserify"),
// 'net': require.resolve('stream-http'),
// 'path': require.resolve('path-browserify')
// }
// }
// },
// resolve: {
// fallback: {
// crypto: require.resolve('crypto-browserify')
// }
// }
outputDir: process.env.VUE_APP_DIST, // 打包后文件的目录
publicPath: './', // 静态资源路径(默认/,打包后会白屏)
assetsDir: 'static', //outputDir的静态资源(js、css、img、fonts)目录
// 开发服务器配置
devServer: {
// 自动打开浏览器
open: true,
// 端口号
port: 8080,
// 允许跨域请求
proxy: {
'/api': {
// 代理的目标地址
target: 'http://your-api-server.com',
// 是否改变请求头中的 host
changeOrigin: true,
// 路径重写
pathRewrite: {
'^/api': ''
}
}
}
}
})