"TypeError: Object(...) is not a function" exception when importing the generated client in Next.JS app
godness84 opened this issue · 2 comments
godness84 commented
I use Next.JS with typescript plugin. When I import the generated client that's the exception that gets raised.
If I replace exports.createClient
with module.exports.createClient
it works.
What am I missing?
helios1138 commented
can you provide the full error with stack trace? also, what is your Node version and what's in your tsconfig.json
?
godness84 commented
Hi @helios1138 , sure!
[ event ] build page: /grid
[ wait ] compiling ...
[ warn ] ./pages/grid.tsx
Attempted import error: 'createClient' is not exported from './../client/createClient'.
[ info ] ready on null
TypeError: Object(...) is not a function
at Module../pages/grid.tsx (/Users/itsme/dev/recipejs/packages/web/.next/server/static/development/pages/grid.js:589:88)
at __webpack_require__ (/Users/itsme/dev/recipejs/packages/web/.next/server/static/development/pages/grid.js:23:31)
at Object.3 (/Users/itsme/dev/recipejs/packages/web/.next/server/static/development/pages/grid.js:756:18)
at __webpack_require__ (/Users/itsme/dev/recipejs/packages/web/.next/server/static/development/pages/grid.js:23:31)
at /Users/itsme/dev/recipejs/packages/web/.next/server/static/development/pages/grid.js:91:18
at Object.<anonymous> (/Users/itsme/dev/recipejs/packages/web/.next/server/static/development/pages/grid.js:92:12)
at Module._compile (internal/modules/cjs/loader.js:701:30)
at Module.m._compile (/Users/itsme/dev/recipejs/node_modules/ts-node/src/index.ts:439:23)
at Module._extensions..js (internal/modules/cjs/loader.js:712:10)
at Object.require.extensions.(anonymous function) [as .js] (/Users/itsme/dev/recipejs/node_modules/ts-node/src/index.ts:442:12)
at Module.load (internal/modules/cjs/loader.js:600:32)
at tryModuleLoad (internal/modules/cjs/loader.js:539:12)
at Function.Module._load (internal/modules/cjs/loader.js:531:3)
at Module.require (internal/modules/cjs/loader.js:637:17)
at require (internal/modules/cjs/helpers.js:22:18)
at EventEmitter.handleCallback (/Users/itsme/dev/recipejs/node_modules/next/dist/server/on-demand-entry-handler.js:246:35)
Node: v10.15.3
tsconfig.json:
{
"compileOnSave": false,
"compilerOptions": {
"experimentalDecorators": true,
"noEmit": true,
"strict": true,
"target": "esnext",
"module": "esnext",
"jsx": "preserve",
"allowJs": true,
"moduleResolution": "node",
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"noUnusedLocals": false,
"noUnusedParameters": false,
"removeComments": false,
"preserveConstEnums": true,
"sourceMap": true,
"skipLibCheck": true,
"baseUrl": ".",
"typeRoots": [
"./node_modules/@types"
],
"lib": [
"dom",
"es2015",
"es2016"
],
"outDir": ".next"
},
"exclude": [
".next",
"server/**/*.*"
]
}
And here how it is transpiled in my grid.js
file (copy-pasted just the interesting part):
/***/ "./client/createClient.js":
/*!********************************!*\
!*** ./client/createClient.js ***!
\********************************/
/*! no exports provided */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _babel_runtime_corejs2_core_js_object_assign__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime-corejs2/core-js/object/assign */ "../../node_modules/@babel/runtime-corejs2/core-js/object/assign.js");
/* harmony import */ var _babel_runtime_corejs2_core_js_object_assign__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_babel_runtime_corejs2_core_js_object_assign__WEBPACK_IMPORTED_MODULE_0__);
var __assign = undefined && undefined.__assign || function () {
__assign = _babel_runtime_corejs2_core_js_object_assign__WEBPACK_IMPORTED_MODULE_0___default.a || function (t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) {
if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
}
}
return t;
};
return __assign.apply(this, arguments);
};
Object.defineProperty(exports, '__esModule', {
value: true
});
var __1 = __webpack_require__(/*! graphql-typed-client */ "graphql-typed-client");
exports.createClient = function (options) {
var typeMap = __1.linkTypeMap(__webpack_require__(/*! ./typeMap.json */ "./client/typeMap.json"));
return __1.createClient(__assign({}, options, {
queryRoot: typeMap.Query,
mutationRoot: typeMap.Mutation
}));
};
/***/ }),