NodeJS 如何修复“错误:错误:0308010C:数字信封例程::不支持”错误,当升级节点从14到20?

kognpnkq  于 2023-08-04  发布在  Node.js
关注(0)|答案(1)|浏览(117)

bounty还有5天到期。回答此问题可获得+50声望奖励。Tony正在寻找一个答案从一个有信誉的来源:直接聊天也很好与我来解决这个问题.

我的应用(不是create-reat-app CRA)是react和typescript项目,在Node 14中运行良好,但Node 16以外的任何版本都会导致以下错误:尝试了所有的解决方案从internnet但没有工作了。请检查并让我知道这个问题,谢谢。
遵循以下文章解决问题,但失败:https://www.freecodecamp.org/news/error-error-0308010c-digital-envelope-routines-unsupported-node-error-solved/
x1c 0d1x的数据

Package.JSON

{
  "name": "@testApp/testApp-react",
  "version": "0.22.0-test",
  "description": "testApp React",
  "main": "./build/index.js",
  "types": "./build/index.d.ts",
  "files": [
    "src",
    "!src/**/__tests__/**",
    "lib",
    "tsconfig.json",
    "typings/**",
    "rn-cli.config.js"
  ],
  "scripts": {
    "build:src": "tsc",
    "build:lib": "tsc -p lib",
    "build:web:dev": "npm run build:lib && webpack --config web/webpack.config.dev.js",
    "build:web:prod": "npm run build:lib && webpack --define process.env.NODE_ENV=\"'production'\" --config web/webpack.config.prod.js",
    "lint:eslint:html": "eslint src scripts -f html -o ./reports/lint.html",
    "lint": "eslint src scripts && cd tslint-rules && tsc noRawTextRule.ts && cd .. && ./run-tslint.sh",
    "run:web:dev": "npm run build:lib && webpack-dev-server --port 3000 --host 0.0.0.0 --config web/webpack.config.dev.js --inline --hot --colors",
    "setup:ios": "npm run build:lib && bundle install --deployment && cd ios && bundle exec pod cache clean IDZSwiftCommonCrypto --all && bundle exec pod install --repo-update --verbose",
    "start": "npm run build:lib && node node_modules/react-native/local-cli/cli.js start",
    "test:src": "cross-env NODE_ICU_DATA=node_modules/full-icu jest --forceExit --detectOpenHandles",
    "tsc": "tsc"
  },
  "repository": {
    "type": "git",
    "url": "https://stash.testApp.com/scm/dxp/testApp-react.git"
  },
  "publishConfig": {
    "registry": "https://test-bnk.testApp.com/repo/repository/npm-internal/"
  },
  "author": "testApp Technology Pty Ltd",
  "license": "UNLICENSED",
  "dependencies": {
    "@babel/preset-env": "7.3.4",
    "@testApp/lottie-react-native": "3.3.2-testApp.0",
    "@testApp/react-native-calendars": "1.19.3-testApp.1",
    "@testApp/react-native-interactable": "0.1.3-testApp.12",
    "@testApp/react-native-sortable-list": "0.0.22-testApp.0",
    "@testApp/react-slot-fill": "2.0.0-testApp.0",
    "@types/app-root-path": "1.2.4",
    "@types/babel-core": "6.25.3",
    "@types/babel-types": "7.0.4",
    "@types/babel__core": "7.1.0",
    "@types/babel__traverse": "7.0.6",
    "@types/big.js": "4.0.0",
    "@types/bluebird": "3.5.14",
    "@types/chroma-js": "1.3.5",
    "@types/d3-scale": "1.0.10",
    "@types/d3-shape": "1.3.1",
    "@types/d3-time": "1.0.6",
    "@types/geojson": "7946.0.8",
    "@types/glob": "5.0.33",
    "@types/hoist-non-react-statics": "3.3.0",
    "@types/image-size": "0.0.29",
    "@types/lodash": "4.14.116",
    "@types/minimatch": "3.0.3",
    "@types/mkdirp": "0.5.1",
    "@types/moment-timezone": "0.5.4",
    "@types/mustache": "0.8.30",
    "@types/node": "10.12.11",
    "@types/numeral": "0.0.20",
    "@types/opentype.js": "0.0.0",
    "@types/pdfkit": "0.7.36",
    "@types/pluralize": "0.0.28",
    "@types/react": "17.0.0",
    "@types/react-beautiful-dnd": "2.3.1",
    "@types/react-dom": "^18.2.7",
    "@types/read-chunk": "2.1.0",
    "@types/redux-logger": "2.6.34",
    "@types/remote-redux-devtools": "0.5.1",
    "@types/rev-hash": "2.0.0",
    "@types/source-map": "0.5.2",
    "app-root-path": "2.0.1",
    "appcenter-cli": "2.3.0",
    "archiver": "1.0.1",
    "art": "0.10.1",
    "awesome-typescript-loader": "5.2.1",
    "babel-eslint": "7.1.1",
    "babel-loader": "8.0.5",
    "babel-plugin-module-resolver": "3.0.0",
    "babel-plugin-react-native-web": "0.16.0",
    "babel-polyfill": "6.23.0",
    "babel-traverse": "6.26.0",
    "big.js": "5.0.3",
    "bluebird": "3.4.1",
    "chroma-js": "1.3.7",
    "commander": "2.19.0",
    "cross-spawn": "5.1.0",
    "css-loader": "0.28.7",
    "d3": "4.5.0",
    "d3-scale": "1.0.4",
    "d3-shape": "1.0.4",
    "d3-time": "1.0.4",
    "del": "2.2.2",
    "es6-promise": "4.1.1",
    "file-loader": "0.10.1",
    "full-icu": "1.3.0",
    "glob": "7.0.5",
    "hoist-non-react-statics": "3.3.0",
    "html-webpack-plugin": "3.2.0",
    "i18next": "10.0.7",
    "image-size": "0.6.1",
    "intl": "1.2.5",
    "is-png": "1.1.0",
    "is-svg": "2.1.0",
    "isomorphic-fetch": "2.2.1",
    "jest-diff": "24.5.0",
    "jju": "1.3.0",
    "lodash": "4.17.15",
    "map-stream": "0.0.6",
    "merge2": "1.0.2",
    "metro": "0.53.0",
    "metro-core": "0.53.0",
    "metro-react-native-babel-preset": "^0.69.0",
    "metro-react-native-babel-transformer": "0.53.0",
    "metrohash": "^2.8.0",
    "mkdirp": "0.5.1",
    "moment": "2.22.2",
    "moment-timezone": "0.5.14",
    "mustache": "2.2.1",
    "node-xml-lite": "0.0.7",
    "numeral": "2.0.4",
    "opentype.js": "0.7.3",
    "pdfkit": "0.9.0",
    "pluralize": "7.0.0",
    "prop-types": "15.6.0",
    "react": "18.2.0",
    "react-art": "16.8.3",
    "react-beautiful-dnd": "2.5.0",
    "react-dom": "18.2.0",
    "react-grid-layout": "1.3.4",
    "react-i18next": "12.3.1",
    "react-native": "0.71.0",
    "react-native-animatable": "1.3.0",
    "react-native-maps": "1.7.0",
    "react-native-modal-datetime-picker": "4.11.0",
    "react-native-render-html": "4.1.2",
    "react-native-safe-module": "1.2.0",
    "react-native-svg": "5.4.1",
    "react-native-typescript-transformer": "1.2.13",
    "react-native-web": "0.18.10",
    "react-redux": "7.2.8",
    "react-resizable": "1.6.0",
    "read-chunk": "2.1.0",
    "redux": "3.7.2",
    "redux-logger": "2.6.1",
    "redux-thunk": "2.2.0",
    "remote-redux-devtools": "0.5.16",
    "reselect": "3.0.1",
    "rev-hash": "2.0.0",
    "rxjs": "5.4.3",
    "style-loader": "0.19.1",
    "svg-to-pdfkit": "0.1.4",
    "svg2vectordrawable": "1.1.10",
    "through2": "2.0.1",
    "traverse": "0.6.6",
    "ts-node": "8.0.2",
    "tsconfig-paths": "3.8.0",
    "tsconfig-paths-webpack-plugin": "1.2.0",
    "tslib": "1.8.0",
    "tslint": "5.10.0",
    "typescript": "4.0.2",
    "typescript-json-schema": "0.19.0",
    "url-loader": "1.1.2",
    "uuid": "3.0.1",
    "vinyl": "1.2.0",
    "webpack-merge": "4.1.0",
    "xlsx": "0.14.1"
  },
  "devDependencies": {
    "@babel/runtime": "^7.15.4",
    "@types/cheerio": "0.22.2",
    "@types/intl": "1.2.0",
    "@types/jest": "24.0.11",
    "@types/mockdate": "2.0.0",
    "@types/redux-mock-store": "0.0.8",
    "babel-jest": "24.4.0",
    "babel-plugin-jest-hoist": "24.3.0",
    "babel-plugin-transform-react-remove-prop-types": "0.4.6",
    "concurrently": "3.4.0",
    "cross-env": "5.2.0",
    "enzyme": "3.9.0",
    "enzyme-adapter-react-16": "1.11.2",
    "eslint": "3.16.1",
    "eslint-config-airbnb": "12.0.0",
    "eslint-plugin-import": "1.16.0",
    "eslint-plugin-jsx-a11y": "2.2.2",
    "eslint-plugin-react": "6.3.0",
    "git-revision-webpack-plugin": "3.0.3",
    "jest": "24.4.0",
    "mockdate": "2.0.2",
    "react-native-mock": "0.3.1",
    "react-test-renderer": "16.8.3",
    "redux-mock-store": "1.2.2",
    "ts-jest": "24.0.0",
    "typescript-tslint-plugin": "0.1.0",
    "webpack": "4.44.2",
    "webpack-cli": "3.3.12",
    "webpack-dev-server": "3.11.3"
  }
}

字符串

Webpack.config.common.js和webpack.config.dev.js

const appRootPath = require('app-root-path');
const customizationTransformer = require('../lib/customizationTransformer').default;
const fs = require('fs');
const glob = require('glob');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const jju = require('jju');
const os = require('os');
const process = require('process');
const revHash = require('rev-hash');
const ts = require('typescript');
const NodePolyfillPlugin = require('node-polyfill-webpack-plugin');

const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');

function loadJsonFile(jsonFilename) {
  if (!fs.existsSync(jsonFilename)) {
    throw new Error('Input file not found: ' + jsonFilename);
  }

  const buffer = fs.readFileSync(jsonFilename);
  try {
    return jju.parse(buffer.toString());
  } catch (error) {
    throw new Error('Error reading "' + jsonFilename + '":'+os.EOL + ' ' + error.message);
  }
}

const tsConfig = (() => {
  const tsConfigPath = appRootPath.resolve('tsconfig.json');
  if (fs.existsSync(tsConfigPath)) {
    return loadJsonFile(tsConfigPath);
  }
  throw new Error('Unable to find tsconfig.json at ' + tsConfigPath);
})();

const compilerOptions = ts.convertCompilerOptionsFromJson((Object.assign(tsConfig.compilerOptions, {
  sourceMap: true,
  inlineSources: true,
})), process.cwd());

const rootFileNames = [
  ...glob.sync(appRootPath.resolve('src/**/*.ts*')),
  ...glob.sync(appRootPath.resolve('node_modules/@test/abc-front-end/src/**/*.ts*')),
];

module.exports = {
  devtool: 'cheap-module-source-map',
  entry: [
    'babel-polyfill',
    './src/index.web.tsx',
  ],
  module: {
    rules: [

      {
        test: /\.(ts)x?$/,
        exclude: /node_modules|\.d\.ts$/, // this line as well
        use: {
          loader: 'ts-loader',
          options: {
          compilerOptions: {
          noEmit: false, // this option will solve the issue
         },
        },
       },
      },
      {
        test: /\.(js|ts|tsx?)$/,
        use: {
          loader: 'babel-loader',
          options: {
            cacheDirectory: true,
            plugins: ['react-native-web'],
            presets: ['@babel/preset-env'],
            exclude: [/node_modules+.(?!(punycode))/],
          },
        },
      },
      {
        test: /\.(png|jpg|gif|svg|eot|ttf|woff|woff2)$/,
        loader: 'url-loader',
      },
      {
        test: /\.css$/,
        use: [
          { loader: 'style-loader', options: { debug: true } },
          { loader: 'css-loader', options: { debug: true } },
        ],
      },
    ],
  },
  plugins: [
    new NodePolyfillPlugin(),
    new HtmlWebpackPlugin({
      inject: true,
      template: 'web/src/index.html',
    }),
    new webpack.ProvidePlugin({
      process: 'process/browser',
      Buffer: ['buffer', 'Buffer'],
  })
  ],
  resolve: {
    extensions: ['.web.js', '.js', '.json', '.web.ts', '.web.tsx', '.ts', '.tsx'],
    plugins: [new TsconfigPathsPlugin(),
      new NodePolyfillPlugin(),

      new webpack.ProvidePlugin({
        process: 'process/browser',
        Buffer: ['buffer', 'Buffer'],
    })],
    alias: {
      'react-native': 'react-native-web',
      'react/lib/ReactInstanceMap': 'react-dom/lib/ReactInstanceMap',
      'react/lib/ReactMultiChild': 'react-dom/lib/ReactMultiChild',
      'react/lib/ReactUpdates': 'react-dom/lib/ReactUpdates',
    },
  },
  stats: {
    errorDetails: true
  }
};

const path = require('path');
const webpack = require('webpack');
const merge = require('webpack-merge');
const common = require('./webpack.config.common.js');
const NodePolyfillPlugin = require('node-polyfill-webpack-plugin');


module.exports = merge(common, {
  mode: 'development',
  devServer: {
    port: 3000,
    host: '0.0.0.0',
    inline: true,
    colors: true,
    hot:true,
    contentBase: path.join(__dirname, 'src'),
    proxy: {
      '/customers': {
        target: 'http://localhost:8801',
        secure: false,
      },
    },
  },
  output: {
    path: path.join(__dirname, '../build'),
    filename: 'react/bundleDev.js',
  },
  resolve: {
    fallback: {
      assert: require.resolve('assert'),
      buffer: require.resolve('buffer'),
      console: require.resolve('console-browserify'),
      constants: require.resolve('constants-browserify'),
      crypto: require.resolve('crypto-browserify'),
      domain: require.resolve('domain-browser'),
      events: require.resolve('events'),
      http: require.resolve('stream-http'),
      https: require.resolve('https-browserify'),
      os: require.resolve('os-browserify/browser'),
      path: require.resolve('path-browserify'),
      punycode: require.resolve('punycode'),
      process: require.resolve('process/browser'),
      querystring: require.resolve('querystring-es3'),
      stream: require.resolve('stream-browserify'),
      string_decoder: require.resolve('string_decoder'),
      sys: require.resolve('util'),
      timers: require.resolve('timers-browserify'),
      tty: require.resolve('tty-browserify'),
      url: require.resolve('url'),
      util: require.resolve('util'),
      vm: require.resolve('vm-browserify'),
      zlib: require.resolve('browserify-zlib'),
    },
  }
});

TSCONFIG.JSON

{
  "compilerOptions": {
    "allowJs": true,
    "allowSyntheticDefaultImports": true,
    "baseUrl": ".",
    "experimentalDecorators": true,
    "forceConsistentCasingInFileNames": true,
    "importHelpers": false,
    "isolatedModules": true,
    "jsx": "react",
    "module": "es2015",
    "moduleResolution": "node",
    "noEmit": false,
    "noEmitHelpers": false,
    "noErrorTruncation": true,
    "noFallthroughCasesInSwitch": true,
    "noImplicitAny": true,
    "noImplicitReturns": true,
    "noImplicitThis": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "outDir": "build",
    "preserveConstEnums": true,
    "pretty": true,
    "skipLibCheck": true,
    "sourceMap": true,
    "strict": true,
    "strictNullChecks": true,
    "target": "es2015",
    "paths": {
      "react": [ "./node_modules/@types/react" ],
      "dbfe/*": [
        "src/*",
        "src/*.ios",
        "src/*.android",
        "node_modules/@test/TEST-front-end/src/*",
        "node_modules/@test/TEST-front-end/src/*.ios",
        "node_modules/@test/TEST-front-end/src/*.android"
      ]
    },
    "typeRoots":[
      "./typings",
      "./node_modules/@types"
    ]
  },
  "exclude": [
    "*.js",
    "android",
    "coverage",
    "scripts",
    "sub-resources",
    "web",
    "ios",
    "build",
    "node_modules",
    "vendor",
    "lib"
  ],
  "filesGlob": [
    "src/**/*.ts",
    "src/**/*.tsx",
    "node_modules/@test/TEST-front-end/src/**/*.ts",
    "node_modules/@test/TEST-front-end/src/**/*.tsx"
  ],
  "types": [
    "react",
    "react-native",
    "jest"
  ],
  "plugins": [
    {
      "name": "typescript-tslint-plugin"
    }
  ]
}

bogh5gae

bogh5gae1#

你使用了node-polyfill-webpack-plugin,这导致了这个问题,因为webpack 5默认情况下不再包含Node.js核心模块的polyfills。代替通过此插件为Node.js核心模块添加polyfill,您可以使用webpack配置的resolve部分中的fallback选项。

const path = require('path'); // add this line to import the 'path' module
const webpack = require('webpack');

字符串
并将回退函数替换为

fallback: {
      assert: require.resolve('assert'),
      buffer: require.resolve('buffer'),
      console: require.resolve('console-browserify'),
      constants: require.resolve('constants-browserify'),
      crypto: require.resolve('crypto-browserify'),
      domain: require.resolve('domain-browser'),
      events: require.resolve('events'),
      http: require.resolve('stream-http'),
      https: require.resolve('https-browserify'),
      os: require.resolve('os-browserify/browser'),
      path: require.resolve('path-browserify'), // Add this line for 'path' module
      punycode: require.resolve('punycode'),
      process: require.resolve('process/browser'),
      querystring: require.resolve('querystring-es3'),
      stream: require.resolve('stream-browserify'),
      string_decoder: require.resolve('string_decoder'),
      sys: require.resolve('util'),
      timers: require.resolve('timers-browserify'),
      tty: require.resolve('tty-browserify'),
      url: require.resolve('url'),
      util: require.resolve('util'),
      vm: require.resolve('vm-browserify'),
      zlib: require.resolve('browserify-zlib'),
    },
  },

  // ... (existing code)
};


通过进行此更改,我们告诉Webpack在捆绑代码时为Node.js核心模块使用指定的浏览器兼容模块(polyfills)。
另外,在webpack.config.dev.js中,plugins部分有两个new NodePolyfillPlugin()示例。在通用配置中只需要它的一个示例。您可以从webpack.config.dev.js中删除额外的一个。

相关问题