I am starting to learn Javascript from a C# background and have started building a simple GraphQL API as my first project but I am struggling to get example code working and I am not sure where to look for the solution.
I am following the usage section here: https://www.npmjs.com/package/apollo-server-koa
But the following line is throwing an error:
router.post('/graphql', graphqlKoa({ schema: ironManSchema }));
TypeError: graphqlKoa is not a function
I am not sure what is causing this, is it a bug in the example code? A problem with trying to use ES6? Something caused by the version of Node.JS I have installed? (Upgraded to 10.1.0 just in case) Or perhaps it is because I am trying to debug it in Visual Studio Code.
apollo-server-koa has no graphqlKoa anymore since 2.x. You should use 1.x version.
The apollo-server-koa module does not export a function -- if it did then you would be able to simply import it like this:
const graphqlKoa = require('apollo-server-koa')
Instead, it effectively exports an object, with one of it's properties being graphqlKoa, which is a function. That means to use it in your project, you should do one of the following:
const apolloServer = require('apollo-server-koa')
const graphqlKoa = apolloServer.graphqlKoa
const graphqlKoa = require('apollo-server-koa').graphqlKoa
const { graphqlKoa } = require('apollo-server-koa')
// ES6 syntax
import { graphqlKoa } from 'apollo-server-koa'
The curly brackets in the third example are just destructuring assignment syntax.
Related
I'm trying to do some code splitting and moment.js is one of the targeted packages I want to isolate in a separate chunk. I'm doing it like this:
const myFn = async (currentNb) => {
const moment = (await import('moment')).default()
const dateUnix: number = moment(currentNb).valueOf()
[...]
}
But I get the following error: this expression is not callable. Type Moment has no call signatures . So I guess I should be doing something like moment.valueOf(currentNb) but I'm not really sure. Can someone put some light to this? Thanks in advance
So apparently my syntax was incorrect. I finally found how to solve this problem. I need to import it as follows:
const {default: moment} = await import('moment')
I found the answer in the webpack documentation:
The reason we need default is that since webpack 4, when importing a
CommonJS module, the import will no longer resolve to the value of
module.exports, it will instead create an artificial namespace object
for the CommonJS module.
😃
I'm facing a compilation issue, that I've managed to work-around somehow, but I'd like to understand where exactly is the problem coming from. Here is the issue:
I'm using react-create-app project to bootstrap a React project and I get the following error, at compilation time, with react-scripts (v3.1.1), when running react-scripts start:
Failed to compile.
./src/reducers/test.js
TypeError: Cannot read property 'name' of null
at Array.filter (<anonymous>)
The error occurs on the test.js file:
const initialArray = ['value1'];
export default function(inputArray = initialArray) {
return [...inputArray, 'value2'];
};
After investigating, I've found this, more or less related problem, https://github.com/standard-things/esm/issues/434, of default exporting an anonymous function. Naming my function, solved the compilation problem 👍
const initialArray = ['value1'];
export default function myFunc(inputArray = initialArray) {
return [...inputArray, 'value2'];
};
(a named export instead of the default export also solved the problem)
But I've often exported anonymous functions by default, and I've never faced a compilation failure. And this is something I'm currently doing in other parts of my code, without experiencing a compilation failure from react-scripts.
So I also had a look at the input array used by the function. If I remove the spread operator to have a return line like this: return ['value2'];, it compiles, but the function's behaviour is altered. So I tried to change my default assignment to inputArray like this, and it compiled too:
const initialValue = 'value1';
export default function(inputArray = [initialValue]) {
return [...inputArray, 'value2'];
};
But once again, I don't understand why my initial solution wouldn't compile. Do you see something I've been missing all along?
Thank you guys for your time! 🙏
I need to create a custom matcher for Jest test framework, specifically same as .toEqual() but with optional message parameter.
I started with copying everything from actual .toEqual() matcher from here.
I managed to bring all of the the used in this matcher functions except isOneline. It is defined here.
But I do not see how can I import/require it to my code. Is it possible?
Have you tried?
const { isOneline} = require('<path to util.js file>');
Or
const isOneline= require('<path to util.js file>').isOneline;
EDIT:
This works (see comment):
const isOneline = require('expect/build/utils').isOneline;
Hey I am doing a small project using react-app and I
have been trying all day to create export for this module.
I have installed it with npm, and i want to edit it so i can import and use it in my app.js
I have tried to define "reddit" using class\function\let and use either:
export default
module.exports
And either
import reddit from 'reddit.js';
var reddit = require('reddit.js');
And trying to check with a simple function from the module:
console.log(reddit.hot('cats'));
But I am still getting:
Uncaught TypeError: reddit.hot is not a function
I am a bit lost, what am I doing wrong?
The module uses window.reddit global variable. Don't override it!
So if you are on client side, just use:
require('reddit.js')
//...
reddit.hot('cats')
For server side - you have to do some trick to make it work, because on server side you don't have 'window' global variable.
Upd:
Example of back end usage:
const window = {};
const r = require('./reddit.js') // You don't really use r
const reddit = window.reddit;
reddit.hot('cats')
Reddit does not export anything because it was mainly designed to be added as a script tag!
// So for CommonJS module:
require('reddit.js');
//And for ES6 modules
import 'reddit.js';
And you you will be able to access reddit and reddit.hot() method through the window object.
I'm trying to convert an old JavaScript library into ES6 compatible module.
The library is tracking.js (https://github.com/eduardolundgren/tracking.js/blob/master/build/tracking.js) but all my results ends with: Cannot read property 'xxx' of undefined
Is there any easy way to use such module? I'm trying to create just basic example like https://trackingjs.com/docs.html#step-2
Update
Because there is a request for more code. Let me show one of the non-working examples (part of Vue.js component):
import tracking from 'tracking';
export default {
created() {
const colors = new tracking.ColorTracker(['magenta', 'cyan', 'yellow']);
}
};
And the error is TypeError: _tracking2.default.ColorTracker is not a constructor
You should use the exports-loader, no modification of the library is necessary, the loader will look for the variable on the global scope, e.g:
import * as tracking from 'exports-loader?tracking!tracking';
The exports-loader needs to know how to access the module on the global scope (tracking.js assigns its self to window.tracking). Here you're telling it to use the exports-loader with parameter tracking (after the query question mark) to load the module tracking (after the explanation mark).