Troubleshooting TypeScript import problems within apollo-server-express, apollo-server, and apollo-cache-control

Currently, I am in the process of upgrading from "apollo-server": "^2.9.4" and "apollo-server-express": "^2.9.4 to version 2.12.0 in my Typescript project. However, while building the application, I encountered the following error:

node_modules/apollo-server-express/node_modules/apollo-server-core/dist/plugin/index.d.ts:1:13

error TS1005: '=' expected.

1 import type { ApolloServerPlugin } from 'apollo-server-plugin-base';

https://i.sstatic.net/ckCH2.png

I have tried deleting the node_modules folder and package-lock.json, but the issue persists. Any assistance with resolving this would be greatly appreciated...

tsconfig.json


{
  "compilerOptions": {
    "target": "es5",
    "moduleResolution": "node",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "outDir": "./dist",
    "declaration": true
  },
  "include": [
    "src/**/*"
  ],
  "exclude": [
    "node_modules",
    "**/*.spec.ts",
    "**/*.test.ts"

  ]

}




package.json

"dependencies": {
    "@apollo/federation": "^0.10.2",
    "@types/bluebird": "^3.5.27",
    "@types/cookie-parser": "^1.4.2",
    "@types/jest": "^24.0.19",
    "@types/mysql": "^2.15.7",
    "@types/nanoid": "^2.0.0",
    "@types/node": "^14.10.1",
    "@types/umzug": "^2.2.2",
    "@types/validator": "^10.11.3",
    "apollo-cache-control": "^0.10.0",
    "apollo-cache-inmemory": "^1.6.6",
    "apollo-client": "^2.6.4",
    "apollo-datasource-rest": "^0.6.1",
    "apollo-link": "^1.2.12",
    "apollo-link-context": "^1.0.20",
    "apollo-link-http": "^1.5.17",
    "apollo-link-rest": "^0.7.3",
    "apollo-link-schema": "^1.2.3",
    "apollo-server": "^2.12.0",
    "apollo-server-express": "^2.12.0",
    "apollo-server-plugin-response-cache": "^0.3.1",
    "apollo-server-testing": "^2.9.0",
    "axios": "^0.19.2",
    "cookie-parser": "^1.4.4",
    "cron": "^1.7.2",
    "elastic-apm-node": "^3.3.0",
    "express": "^4.17.1",
    "express-graphql": "^0.9.0",
    "graphql": "^14.5.8",
    "graphql-import": "^0.7.1",
    "graphql-schema-linter": "^0.2.1",
    "jsonwebtoken": "^8.5.1",
    "jwk-to-pem": "^2.0.3",
    "kafka-node": "^4.1.3",
    "link": "^0.1.5",
    "log4js": "^5.0.0",
    "mysql2": "^1.7.0",
    "nanoid": "^3.1.7",
    "node": "^14.5.0",
    "node-cache": "^5.1.1",
    "node-fetch": "^2.6.0",
    "promise-retry": "^1.1.1",
    "rimraf": "^3.0.0",
    "save": "^2.4.0",
    "sequelize": "^5.19.5",
    "sequelize-cli": "^5.5.1",
    "soap": "^0.30.0",
    "ts-jest": "^24.1.0",
    "typescript": "^3.6.3",
    "umzug": "^2.2.0"
  },
  "devDependencies": {
    "@types/graphql": "^14.5.0",
    "graphql-tag": "^2.10.1",
    "graphql-tools": "^4.0.5",
    "jest": "^24.8.0",
    "jest-cli": "^24.8.0"
  },
  "jest": {
    "testEnvironment": "node",
    "testPathIgnorePatterns": [
      "/node_modules/",
      "/dist/"
    ],
typescriptnpmreact-apolloapollo-servertsconfig

Answer №2

I encountered a similar issue with typescript imports. Despite trying various configurations in the tsconfig.json file including different values for lib, modules, and target, none of them seemed to solve the problem. Reluctantly, I resorted to modifying the node_modules file (sad face). The key change I made was in my index.d.ts file: 

import type { DocumentNode } from 'graphql/language/ast';

changed to 
import { DocumentNode } from 'graphql/language/ast';

Additionally, adjusting the value in lib within the tsconfig.json file also proved beneficial: 
"lib": ["es6", "dom", "esnext", "esnext.asynciterable"],

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

The current Angular 11 build seems to lack in producing sufficient Lazy chunk files

Currently, I am working on implementing lazy loading for modules from different libraries in my project. This involves utilizing two libraries located in the node_modules directory, which are then lazily loaded by the main application. Below is a snippet o ...

angulartypescriptlazy-loadingangular-library

Having trouble locating the bootstrap import statement

Currently, I am working on a project in Angular where I have defined two styles in the angular.json file - styles.css and node_modules/bootstrap/dist/css/bootstrap.min.css. After running ng serve, it shows that it compiled successfully. However, upon ins ...

javascriptangulartypescripttwitter-bootstrap-3

Troubleshooting React/Jest issues with updating values in Select elements on onChange event

I am currently testing the Select element's value after it has been changed with the following code: it("changes value after selecting another field", () => { doSetupWork(); let field = screen.getByLabelText("MySelectField") ...

javascriptreactjstypescriptjestjs

Challenges encountered while using TypeScript to implement the CSS breakpoint mixin

I attempted to replicate the breakpoint mixin functionality described at using TypeScript, but I am having trouble correctly typing the function. import { css } from 'styled-components'; import { breakpoints } from './_variables'; exp ...

reactjstypescriptmixins

Creating custom generic functions such as IsAny and IsUnknown that are based on a table of type assignability to determine

I attempted to craft a generic called IsAny based on this resource. The IsAny generic appears to be functioning correctly. However, when I implement it within another generic (IsUnknown), it fails: const testIsUnknown2: IsUnknown<any> = true; // iss ...

javascripttypescripttypescript-generics

Encountering the following issue: Unhandled Promise Rejection - TypeError: Unable to access property 'value' of null after implementing ngAfterViewInit in the code

I'm attempting to display a Google Map using the place_id extracted from an HTML value. activity-details.page.html <ion-col> <div id="map"></div> <div ...

angulartypescripthook

Tips for incorporating an icon beneath the title of an angular echart

How can I add an icon below the Echart title? I have attempted the following but have been unsuccessful in rendering the icon. https://i.sstatic.net/PUURP.png The code in my component.ts file is as follows: constructor(private sanitizer: DomSanitizer) { ...

javascriptangulartypescriptecharts

Travis CI is encountering a failure while running the 'gatsby build' command, specifically due to error #98123 related to WEB

I've been working on deploying my portfolio website using AWS S3, CloudFront, CodePipeline, and Travis CI. Most things are running smoothly, but I'm encountering consistent build failures with Travis CI. When I run gatsby build, I receive an err ...

npmyamltravis-cigatsby

Convert the existing JavaScript code to TypeScript in order to resolve the implicit error

I'm currently working on my initial React project using Typescript, but I've hit a snag with the code snippet below. An error message is popping up - Parameter 'name' implicitly has an 'any' type.ts(7006) Here is the complet ...

javascriptnode.jsreactjstypescript

Setting up Bootstrap 4 in Laravel 5.7

Currently, I am faced with the task of compiling my app.scss file for a new Laravel project. However, I am hoping to integrate Bootstrap 4 into the project instead of relying on the default Bootstrap that comes with Laravel. Unfortunately, when running npm ...

laravellaravel-5npmbootstrap-4laravel-5.7

Guide on importing a module dynamically in a NodeJS script with custom path aliases set in tsconfig.json

Our project utilizes React and Typescript along with Nx, WebPack, and Babel. Within our monorepo, we have a multitude of applications. To enhance our i18n efforts, I am currently developing a git hook that will scan each application directory and generate ...

node.jstypescripttypescript-module-resolution

What are the limitations of jest and jsdom in supporting contenteditable features?

I am facing an issue with a particular test case: test('get html element content editable value', () => { // arrange const id = 'foo'; document.body.innerHTML = `<div id='${id}' contenteditable="true">1</div ...

typescriptjestjsjsdom

Angular findIndex troubleshooting: solutions and tips

INFORMATION = { code: 'no1', name: 'Room 1', room: { id: 'num1', class: 'school 1' } }; DATABASE = [{ code: 'no1', name: 'Room 1', room: { id: 'num1', ...

javascriptangulartypescript

What methods are available to extract HTML elements from .ts files?

Exploring Angular development has been quite a challenge for me. I've heard that typescript is an extension of javascript, but when it comes to manipulating HTML elements in the .ts file, I seem to be at a loss. I attempted a simple document.getEleme ...

angulartypescript

What is the best way to transmit instructions to a Docker container?

During my deployment process, I need to execute the command npm run production once the files are available on the server. Since my deployment involves a Docker container, I tried running: cd /apps/laradock/ && docker-compose exec -T workspace ba ...

node.jsbashdockernpmdeployment

"Receive a warning in the console regarding an issue with React's forwardRef

I have the following code snippet and I am trying to style my Material UI button using the styled-components library: import React from 'react'; import styled from 'styled-components' import { Button as MuiButton } from '@materia ...

reactjstypescript

Having difficulty installing web3 with npm on my Windows 10 system

I followed all the instructions provided on the following page: https://medium.com/@PrateeshNanada/steps-to-install-testrpc-in-windows-10-96989a6cd594 Everything worked well except for step number 5 where my Node.js version is 8.10.0 instead of 8.10.2, w ...

node.jsnpmethereum

Enhancing npm version within Docker environment

While constructing a Node.js Docker image with the command docker build . -t imagename, I encountered warnings related to npm version. npm WARN deprecated This version of npm lacks support for important features, npm WARN deprecated such as scoped package ...

node.jsdockernpm

Please upgrade the Azure OpenAI npm Package to the latest 2023-12-01-preview Version

Currently, my project utilizes the azure-openai npm package with version 2023-03-15-preview. However, there is a newer version available - 2023-12-01-preview, which comes with various enhancements such as support for DALL-E 3.0 and improved content filteri ...

node.jsazurenpmopenai-apiazure-openai

Having trouble installing "npm install react-youtube"? (ERROR)

When attempting to install "react-youtube" using the command "npm install react-youtube," I encountered various errors. Unfortunately, I am unsure of their origin or how to resolve them. Could someone please provide guidance on resolving these installatio ...

gitreact-nativenpmcmdnpm-install