I installed the moment.js library and was about to play around with it a little bit, when i got this error. I've tried many different things, but nothing has worked. Any ideas?
I have a folder that i've installed moment.js into (npm install moment) and i'm running my program (node isDate.js).
import {moment} from 'moment';
function isDate(string) {
{
moment(string).format(["MM-DD-YYYY", "YYYY-MM-DD"]);
}
} exports.isDate = isDate;
ReferenceError: moment is not defined
As per Aleks comment
const moment= require('moment')
worked for me.
Change this
import {moment} from 'moment';
to this
const moment= require('moment')
You can use this to import moment.
import * as moment from 'moment';
In case the other solution proposals don't work out, checking for hoisting behavior might help.
Here's what helped in my particular case.
Using your example code, it would be changing the function declaration:
import * as moment from 'moment';
function isDate(string) {
return moment(string).format(["MM-DD-YYYY", "YYYY-MM-DD"]);
}
to a function expression:
import * as moment from 'moment';
const isDate = (string) => {
return moment(string).format(["MM-DD-YYYY", "YYYY-MM-DD"]);
}
This resolved the reference error 'moment is not defined' in our React code base, where the function which uses 'moment' was imported in a component file.
See also 'Function Hoisting': Functions - JavaScript | MDN
Related
I'm trying to add redux persist to redux toolkit but for some reason I get an Exported variable 'store' has or is using name '$CombinedState' from external module ".../node_modules/redux/index" but cannot be named. error on vscode.
This is my store configuration file with the added persist config, which if I remove, works fine.
import { configureStore } from "#reduxjs/toolkit";
import { persistReducer } from "redux-persist";
import storage from "redux-persist/lib/storage";
import { createEpicMiddleware } from "redux-observable";
import rootEpic from "onsite/redux/rootEpic";
import rootReducer from "onsite/redux/rootReducer";
const epicMiddleware = createEpicMiddleware();
const persistConfig = {
key: "root",
storage: storage,
};
const persistedReducer = persistReducer(persistConfig, rootReducer);
// Line that shows error
const store = configureStore({
reducer: persistedReducer,
middleware: [epicMiddleware],
});
export default store;
epicMiddleware.run(rootEpic);
Other things I have tried are putting the combineReducers declaration (from rootReducerimport) into the same file or converting the file into plain javascript, with same or similar results. For some reason typescript decides to still haunt me on a javascript file :)
The code still runs, so I'm tempted to leave it like that, but I would like to get rid of it.
I had the same issue, and here's what I figured out:
You need to include Store from redux, and use it as your type definition for your own store return value. Short answer:
import { Store } from 'redux';
[...]
const store:Store = configureStore([...])
[...]
export default store;
Longer answer:
As I understand it, what was happening is that Store type uses $CombinedState as part of its definition. When configureStore() returns, it inherits the State type. However since State is not explicitly used in your code, that now means that your code includes a value that references $CombinedState, despite it not existing anywhere in your code either. When you then try to export it out of your module, you're exporting a value with a type that doesn't exist within your module, and so you get an error.
You can import State from redux (which will in turn explicity cause your code to bring in $CombinedState), then use it to explicitly define store that gets assigned the return of configureStore(). You should then no longer be exporting unknown named types.
You can also be more specific with your Store type, as it is a generic:
const store:Store<RootState>
Although I'm not entirely sure if that would be a circular dependency, since your RootState depends on store.
Adding a
import { $CombinedState } from '#reduxjs/toolkit'
in that file should usually resolve that error.
I'm using react-native-meteor module in react-native-app to connect it to Meteor server.
On Calling the following function in App.js ,
Meteor.connect('ws://192.168.x.x:3000/websocket');
I was getting this error
Invariant Violation: NetInfo has been removed from React.Native.It can now be installed and imported from 'react-native-netinfo'
An issue is already opened here NetInfo Issue but not resolved yet.
NetInfo has been removed from react-native core. It should be installed as a stand alone dependency using following command:
yarn add #react-native-community/netinfo
or:
npm install --save #react-native-community/netinfo
step by step instructions can be found on this github link
I followed these steps mentioned on the above mentioned link , but it didn't resolve the issue completely. After digging the issue a little bit, I found out that in node_modules/react-native-meteor/src/Meteor.js ,
They are still importing NetInfo from 'react-native' and using the old functions
import { Platform, View, NetInfo } from 'react-native';
NetInfo.isConnected.fetch().then(
(connected ) => {
if(connected)
NetInfo.isConnected.addEventListener('connectionChange', isConnected => {
if (isConnected && Data.ddp.autoReconnect) {
Data.ddp.connect();
}
});
}
);
which is obsoleted now.
It has to be imported from #react-native-community/netinfo
After doing the following changes in node_modules/react-native-meteor/src/Meteor.js .
Error fixed:
import { Platform, View } from 'react-native';
import NetInfo from "#react-native-community/netinfo";
NetInfo.fetch().then(state => {
console.log("Connection type", state.type);
console.log("Is connected?", state.isConnected);
let isConnected = state.isConnected;
if(isConnected)
NetInfo.isConnected.addEventListener('connectionChange', isConnected => {
if (isConnected && Data.ddp.autoReconnect) {
Data.ddp.connect();
}
});
});
ImFarhad Does that still work for you? Using your changes to meteor.js I get the error "RNCNetInfo.getCurrentState got 3 arguments, expected 2". Do you know a way around this?
Version of Vue: 2.4.2
Version of webpack: 2.6.1
The task is... I have a component. It gets global variable, a string. And depends on this variable it should dynamically load and show one of seven quite heavy components. It seems to me that it's not a good idea to import it all because of their weight.
Now I've made import like this:
import comp1 from '#/components/comp1.vue';
import comp2 from '#/components/comp2.vue';
export default {
components: {comp1, comp2}
...
}
In the template we'll use it like <comp1></comp1> And this is not what I want. The output file is pretty big and I must move on.
I've tried made like this described in docs:
export default {
components: {comp1: () => import('#/components/comp1.vue')}
...
}
A-a-and we have an error:
[Vue warn]: Failed to resolve async component: function comp1() {
return __webpack_require__.e/* import() */(1).then(__webpack_require__.bind(null, 37));
}
Reason: Error: Loading chunk 1 failed.
The initial idea was:
let param = window.GLOBAL_PARAM;
let str = '#/components/comp2.vue';
switch(param) {
case 1: {
str = '#/components/comp1.vue';
break;
}
case 2: {
str = '#/components/comp3.vue';
break;
}
...
}
export default {
components: {comp: () => import(str)}
...
}
But I've got an error:
[Vue warn]: Failed to resolve async component: function comp() {
return __webpack_require__(50)(componentPath);
}
Reason: Error: Cannot find module '#/components/comp2.vue'.
As I understand, I have a problem with webpack, which can't resolve "#" symbol
So, the questions are:
How should I fix up async loading off my components? Maybe I've made a
sad mistake in my code?
How should I organize by the right way the loading one of the seven components depending on some condition (global variable or param in component). Maybe there are some webpack preferences and/or some plugins. Or maybe I should resole this problem by the other approach?
Good day developers! I'm working with Meteor.js it's my 1st expirience
I created collection in file
// ./dbs/messages.js
import { Mongo } from 'meteor/mongo';
import { Meteor } from 'meteor/meteor';
import { check } from 'meteor/check';
export const Messages = new Mongo.Collection('messages');
and use it in api point with calling Messages.insert like that
// server/mail.js
import Messages from './dbs/messages.js';
Meteor.methods({
'message.post'(messageText, location){
Messages.insert({
messageText: messageText,
location: location
});
}
})
But when I call 'message.post' I get an error
Exception while invoking method 'message.post' TypeError
Messages.insert is not a function
BUT, when I comment collection import and declare it in server/main.js like that
// import Messages from './dbs/messages.js';
const Messages = new Mongo.Collection('messages');
Meteor.methods({
'message.post'(messageText, location){
Messages.insert({
messageText: messageText,
location: location
});
}
});
In this case my Messages.insert works properly.
Who has experience with Meteor - can you explain me what is the reason?
Thanks!
Also I have removed autopublish and insecure packages
As #MasterAM and #Ankur Soni said you need to import Messages using brackets import { Messages } from './dbs/messages.js';
The only way to import without brackets is by defining Messages and then exporting it like so export default Messages;
I initiate my collections in a "common" space. I feel what you did is actually right. You either declare the collection twice, once on the client side and once on the server side or do it only once in a common folder. I see in many documentations that the popular place to keep these declarations is the /imports/api ... which is common to both server and client.
Rgs,
Paul
I am working on the Angular 2.0-Meteor tutorial and on step 20 "Handling Files with CollectionFS" I am getting an error.
"Cannot find module 'meteor/jalik:ufs'." I have tried removing and adding jalik:ufs and calling meteor reset but this error seems to persist.
I get the error when trying to run the sample code included before Step 21 as well.
It is related with typings. Right now I don't think there is an existing typings for this package.
So you can write your own typings.
Or use the temporary way to remove the warning:
Remove import { UploadFS } from 'meteor/jalik:ufs';. Then add declare const UploadFS: any; in any file.
Tutorial was updated in between:
See Point 21.22 Declare meteor/jalik:
Link
declare module "meteor/jalik:ufs" {
interface Uploader {
start: () => void;
}
interface UploadFS {
Uploader: (options: any) => Uploader;
}
export var UploadFS;
}