javascript - Angular 13 : Module not found: Error: Can't resolve 'rxjs/operators'

Question

我已将 angular 升级到 angular 13。当我运行构建 SSR 时，它给了我以下错误。

ERROR in ./node_modules/@angular/common/fesm2015/http.mjs 12:0-56
Module not found: Error: Can't resolve 'rxjs/operators' in '/Users/nr/aws/jobsaf-website-staging/application/node_modules/@angular/common/fesm2015'
Did you mean 'index.js'?
BREAKING CHANGE: The request 'rxjs/operators' failed to resolve only because it was resolved as fully specified
(probably because the origin is strict EcmaScript Module, e. g. a module with javascript mimetype, a '*.mjs' file, or a '*.js' file where the package.json contains '"type": "module"').
The extension in the request is mandatory for it to be fully specified.
Add the extension to the request.
 @ ./src/app/app.server.module.ts 6:0-57 16:25-42
 @ ./src/main.server.ts 3:0-58 3:0-58
 @ ./server.ts 32:0-52 40:15-30 44:0-34 44:0-34

ERROR in ./node_modules/@angular/core/fesm2015/core.mjs 8:0-39
Module not found: Error: Can't resolve 'rxjs/operators' in '/Users/nr/aws/jobsaf-website-staging/application/node_modules/@angular/core/fesm2015'
Did you mean 'index.js'?
BREAKING CHANGE: The request 'rxjs/operators' failed to resolve only because it was resolved as fully specified
(probably because the origin is strict EcmaScript Module, e. g. a module with javascript mimetype, a '*.mjs' file, or a '*.js' file where the package.json contains '"type": "module"').
The extension in the request is mandatory for it to be fully specified.
Add the extension to the request.
 @ ./server.ts 30:0-47 35:0-14

ERROR in ./node_modules/@angular/forms/fesm2015/forms.mjs 11:0-37
Module not found: Error: Can't resolve 'rxjs/operators' in '/Users/nr/aws/jobsaf-website-staging/application/node_modules/@angular/forms/fesm2015'
Did you mean 'index.js'?
BREAKING CHANGE: The request 'rxjs/operators' failed to resolve only because it was resolved as fully specified
(probably because the origin is strict EcmaScript Module, e. g. a module with javascript mimetype, a '*.mjs' file, or a '*.js' file where the package.json contains '"type": "module"').
The extension in the request is mandatory for it to be fully specified.
Add the extension to the request.
 @ ./src/app/app.module.ts 12:0-45 78:12-23
 @ ./src/app/app.server.module.ts 3:0-41 12:18-27
 @ ./src/main.server.ts 3:0-58 3:0-58
 @ ./server.ts 32:0-52 40:15-30 44:0-34 44:0-34

ERROR in ./node_modules/@angular/platform-server/fesm2015/platform-server.mjs 21:0-39
Module not found: Error: Can't resolve 'rxjs/operators' in '/Users/nr/aws/jobsaf-website-staging/application/node_modules/@angular/platform-server/fesm2015'
Did you mean 'index.js'?
BREAKING CHANGE: The request 'rxjs/operators' failed to resolve only because it was resolved as fully specified
(probably because the origin is strict EcmaScript Module, e. g. a module with javascript mimetype, a '*.mjs' file, or a '*.js' file where the package.json contains '"type": "module"').
The extension in the request is mandatory for it to be fully specified.
Add the extension to the request.
 @ ./src/main.server.ts 4:0-77 4:0-77 4:0-77
 @ ./server.ts 32:0-52 40:15-30 44:0-34 44:0-34

ERROR in ./node_modules/@angular/router/fesm2015/router.mjs 10:0-180
Module not found: Error: Can't resolve 'rxjs/operators' in '/Users/nr/aws/jobsaf-website-staging/application/node_modules/@angular/router/fesm2015'
Did you mean 'index.js'?
BREAKING CHANGE: The request 'rxjs/operators' failed to resolve only because it was resolved as fully specified
(probably because the origin is strict EcmaScript Module, e. g. a module with javascript mimetype, a '*.mjs' file, or a '*.js' file where the package.json contains '"type": "module"').
The extension in the request is mandatory for it to be fully specified.
Add the extension to the request.
 @ ./src/app/app.component.ts 2:0-48 35:31-44
 @ ./src/app/app.server.module.ts 2:0-47 13:20-32
 @ ./src/main.server.ts 3:0-58 3:0-58
 @ ./server.ts 32:0-52 40:15-30 44:0-34 44:0-34

我的 package.json 文件:

{
  "name": "admin-panel",
  "version": "0.0.0",
  "license": "MIT",
  "angular-cli": {},
  "scripts": {
    "start": "DEBUG=jobsaf-website:* nodemon --inspect --trace-warnings --legacy-watch  --trace-warnings ./bin/www",
    "seed": "node ./seeds/static-tables.js",
    "test-jobsaf": "mocha --timeout 10000",
    "rm-web": "rm -rf ./public/web/*",
    "ng": "node ./node_modules/@angular/cli/bin/ng serve --host 0.0.0.0",
    "ng:build": "node --max_old_space_size=5048 ./node_modules/@angular/cli/bin/ng  build --configuration production --aot",
    "build:server:prod": "node --max_old_space_size=4048 ./node_modules/@angular/cli/bin/ng run jobsaf-website:server:prod && webpack --config webpack.server.config.js",
    "build:browser:prod": "node --max_old_space_size=4048 ./node_modules/@angular/cli/bin/ng build --configuration production --aot --vendor-chunk --deleteOutputPath=true --buildOptimizer  --progress=true",
    "build:server:staging": "node --max_old_space_size=4048 ./node_modules/@angular/cli/bin/ng run jobsaf-website:server:staging && webpack --config webpack.server.config.js",
    "build:browser:staging": "node --max_old_space_size=4048 ./node_modules/@angular/cli/bin/ng build --configuration production --configuration=staging --aot --vendor-chunk --deleteOutputPath=true --buildOptimizer",
    "build:stats": "node --max_old_space_size=3192 node_modules/@angular/cli/bin/ng build --configuration production --aot --vendor-chunk --deleteOutputPath=true --buildOptimizer  --progress=true --configuration production --stats-json",
    "build:prod": "npm run rm-web && npm run build:server:prod && npm run build:browser:prod",
    "build:staging": "npm run rm-web && npm run build:server:staging && npm run build:browser:staging",
    "server": "node local.js",
    "file:migration": "APP_FILE_MIGRATION=true node ./migration/file-migration.js",
    "test_env": "set NODE_ENV=test",
    "jest": "jest --detectOpenHandles --watchAll --config ./jest.config.js",
    "coverage": "jest -i --coverage",
    "jest:ci": "jest --detectOpenHandles --forceExit --config ./jest.config.js",
    "test": "npm run test_env && npm run jest",
    "test:ci": "npm run test_env && npm run seed && npm run jest:ci",
    "dev:ssr": "ng run jobsaf-website:serve-ssr",
    "serve:ssr": "node public/web/server/main.js",
    "build:ssr": "ng build --configuration production && ng run jobsaf-website:server:prod",
    "prerender": "ng run jobsaf-website:prerender",
    "postinstall": "ngcc"
  },
  "private": true,
  "napa": {
    "jquery.flot.spline": "miloszfalinski/jquery.flot.spline",
    "ika.jvectormap": "kakirigi/ika.jvectormap"
  },
  "dependencies": {
    "@angular/animations": "^13.0.2",
    "@angular/common": "^13.0.2",
    "@angular/compiler": "^13.0.2",
    "@angular/compiler-cli": "^13.0.2",
    "@angular/core": "^13.0.2",
    "@angular/forms": "^13.0.2",
    "@angular/material": "^13.0.2",
    "@angular/platform-browser": "^13.0.2",
    "@angular/platform-browser-dynamic": "^13.0.2",
    "@angular/platform-server": "^13.0.2",
    "@angular/pwa": "^13.0.3",
    "@angular/router": "^13.0.2",
    "@angular/service-worker": "^13.0.2",
    "@fortawesome/angular-fontawesome": "^0.10.1",
    "@fortawesome/fontawesome-svg-core": "^1.2.36",
    "@fortawesome/free-brands-svg-icons": "^5.15.4",
    "@fortawesome/free-solid-svg-icons": "^5.15.4",
    "@fullcalendar/core": "^5.10.1",
    "@hapi/joi": "^15.1.0",
    "@ng-select/ng-select": "^8.1.1",
    "@nguniversal/common": "^13.0.1",
    "@nguniversal/express-engine": "^13.0.1",
    "@ngx-loading-bar/core": "^5.1.2",
    "@ngxs/store": "^3.7.3-dev.master-1e7127b",
    "@schematics/angular": "^13.0.3",
    "@sindresorhus/slugify": "^1.1.0",
    "@trademe/ng-defer-load": "^8.2.1",
    "@types/jquery": "^3.5.8",
    "angular-archwizard": "^7.0.0",
    "angular2-uuid": "^1.1.1",
    "apicache": "^1.6.3",
    "archiver": "^5.3.0",
    "aws-sdk": "^2.1031.0",
    "bluebird": "^3.7.2",
    "bootstrap": "5.1.3",
    "compression": "^1.7.4",
    "compromise": "^13.11.4",
    "cookie-parser": "^1.4.6",
    "core-js": "3.19.1",
    "cors": "~2.8.5",
    "debug": "^4.3.2",
    "dotenv": "^10.0.0",
    "easyimage": "^3.1.1",
    "ejs": "^3.1.6",
    "exceljs": "^4.3.0",
    "express": "^4.17.1",
    "express-jwt": "^6.1.0",
    "express-mongo-sanitize": "^2.1.0",
    "express-rate-limit": "^5.5.1",
    "express-useragent": "^1.0.15",
    "express-validator": "^6.13.0",
    "feed": "^4.2.2",
    "file-saver": "^2.0.5",
    "firebase-admin": "^10.0.0",
    "font-awesome": "^4.7.0",
    "generate-password": "^1.7.0",
    "google-auth-library": "^7.10.2",
    "hammerjs": "^2.0.8",
    "helmet": "^4.6.0",
    "html-pdf": "^3.0.1",
    "http-status": "^1.5.0",
    "intl-tel-input": "^17.0.13",
    "izitoast": "1.4.0",
    "joi-objectid": "^4.0.2",
    "jquery": "^3.6.0",
    "jsonwebtoken": "^8.5.1",
    "jwt-decode": "^3.1.2",
    "keyword-extractor": "0.0.20",
    "kickbox": "^2.0.4",
    "libphonenumber-js": "^1.9.43",
    "localstorage-polyfill": "^1.0.1",
    "lodash": "^4.17.21",
    "lodash.uniq": "^4.5.0",
    "md5": "^2.3.0",
    "moment": "^2.29.1",
    "mongoose": "5.8.11",
    "mongoose-history": "^0.8.0",
    "mongoose-unique-validator": "^2.0.3",
    "mongoose-url-slugs": "^1.0.2",
    "multer": "^1.4.3",
    "multer-s3": "^2.10.0",
    "multer-s3-transform": "^2.10.3",
    "mysql": "^2.18.1",
    "ng-recaptcha": "^9.0.0",
    "ng2-file-upload": "^1.4.0",
    "ngx-auth": "^5.4.0",
    "ngx-bootstrap": "^6.1.0",
    "ngx-facebook": "^3.0.0-0",
    "ngx-img-cropper": "^11.0.0",
    "ngx-infinite-scroll": "^10.0.1",
    "ngx-moment": "^5.0.0",
    "ngx-pagination": "^5.1.1",
    "ngx-quill-editor": "^2.2.2",
    "ngx-toastr": "^14.2.0",
    "node-schedule": "^2.0.0",
    "nodemailer": "^6.7.1",
    "passport": "^0.5.0",
    "passport-facebook-token": "^4.0.0",
    "passport-google-id-token": "^0.4.7",
    "passport-google-token": "^0.1.2",
    "passport-linkedin-token": "^0.1.1",
    "passport-local": "^1.0.0",
    "pdf-to-text": "0.0.7",
    "phantomjs-prebuilt": "^2.1.16",
    "phone": "^3.1.10",
    "phpass": "^0.1.1",
    "rand-token": "^1.0.1",
    "request": "^2.88.2",
    "request-ip": "^2.1.3",
    "rxjs": "^6.5.5",
    "sharp": "^0.29.3",
    "showdown": "^1.9.1",
    "simple-line-icons": "^2.5.5",
    "socket.io": "^4.3.2",
    "socket.io-client": "^4.3.2",
    "socket.io-redis": "^5.4.0",
    "socketio-auth": "^0.1.1",
    "textract": "^2.5.0",
    "ts-loader": "9.2.6",
    "underscore": "^1.13.1",
    "unique-random-array": "^2.0.0",
    "url": "^0.11.0",
    "util": "^0.12.4",
    "uuid": "^8.3.2",
    "winston": "^3.3.3",
    "xlsx": "^0.17.4",
    "xss-clean": "^0.1.1",
    "zone.js": "~0.11.4",
    "zxcvbn": "^4.4.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~13.0.3",
    "@angular/cli": "^13.0.3",
    "@types/express": "^4.17.13",
    "@types/hammerjs": "^2.0.40",
    "@types/mocha": "^9.0.0",
    "@types/node": "^16.11.7",
    "@types/underscore": "^1.11.3",
    "husky": "^7.0.0",
    "jasmine-core": "~3.10.1",
    "jasmine-spec-reporter": "~7.0.0",
    "jest": "^27.3.1",
    "karma": "^6.3.9",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage-istanbul-reporter": "^3.0.3",
    "karma-jasmine": "~4.0.1",
    "karma-jasmine-html-reporter": "^1.7.0",
    "lint-staged": "^12.0.2",
    "mocha": "^9.1.3",
    "ng-diff-match-patch": "^3.0.1",
    "nodemon": "^2.0.15",
    "protractor": "^7.0.0",
    "supertest": "^6.1.6",
    "tslib": "^2.3.1",
    "tslint": "^6.1.3",
    "typescript": "4.4.3",
    "webpack": "^5.64.1",
    "webpack-cli": "^4.9.1"
  }
}

任何想法

Answer 1

我只是通过将 RxJS 版本更正为 7.4.0 来解决这个问题.我希望这也可以解决其他问题。