Getting './~/mongoose/lib/drivers/index.js' on ng build - node.js

I am using angular-cli for a MEAN stack application. It was working fine till yesterday, but today I am getting,
WARNING in ./~/mongoose/lib/drivers/index.js
8:11-74 Critical dependency: the request of a dependency is an expression
on ng build.
And if i still proceed and run the application i get,
Uncaught TypeError: __webpack_require__.i(...) is not a function
at Object.260 (main.bundle.js:913)
at __webpack_require__ (inline.bundle.js:53)
at Object.142 (main.bundle.js:11)
error on,
var User = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_1_mongoose__["model"])("User", UserSchema);
in main bundle.
My ts file where this code is,
export const User: Model<IUser> = model<IUser>("User", UserSchema);
I searched on net and tried many things but had no luck.
Also some posts are suggesting to run web pack,but this was working till yesterday where I had no web pack.
I also hardcoded the mongoose's version value by removing caret from pacakge.json, had no luck again.

I made a different typescript class for entity model that is to be used on UI(angular 2) side.
Earlier was using the schema class as model in my UI too, hence was getting this error.

Related

Webpack with Next.js bundles file it is not supposed to in client bundle

I have a Next.js app with mongoose to connect to my mongodb. The models import db.ts to make sure that there is an active connection to the database like so:
import { model, models, Schema } from "mongoose";
import "../../db";
This is the code that connects to my database:
import mongoose from "mongoose";
mongoose.connect("mongodb://admin:admin#localhost:27022/admin");
I have gone ahead and made some serverless functions in next.js and added some database fetching from the models in my getServerSideProps. All of which worked perfectly fine. I can interact with the models, create new Documents, delete them and update them. there are no issues.
The Problem
I recently added a new component: it is at /pages/flashcards/[id].tsx. Just like my other components, this one imports one of my mongoose models. However, for some reason, Webpack feels like it should bundle the model and its import of ../../db and send it and send it over to the client, which results in this error:
TypeError: mongoose__WEBPACK_IMPORTED_MODULE_0___default(...).connect
is not a function
Again: This does not happen with any of my other components which use the exact same models as the component which is having these problems.
The issue occurs because you have the following unused import in the /pages/flashcards/[id] page.
import question from "../../db/models/question";
Any code inside getServerSideProps or getStaticProps, and imports used exclusively by these methods, is removed by Next.js when building the client bundle.
However, since question is not explicitly being used in getServerSideProps, Next.js can't figure out the import is only meant to be used on the server. This means it will be included in both the server and client bundles.
You can use the Next.js Code Elimination tool to verify what Next.js eliminates from the client-side bundle. You'll see that if you run your page's code through it, the import is not removed. However, as soon as you reference and use it inside getServerSideProps, Next.js automatically eliminates it from the imports.
Make sure to always comment out/remove unused imports (there are linting rules to help you do that).
Have you tried upgrading the next npm package to the latest version? (12.0.8 as of this writing). I had a similar issue with Next giving inconsistent errors between different API routes, all configured the same way but some raising the same TypeError you shared. Upgrading the package resolved the issue for me.

Debug compilation errors errors using Angular Universal in Angular 8 Application

A Brief Backstory
I have been implementing several upgrades to an Angular 8 application such as server-side rendering, and Google Analytics. As most developers do, I would code then test then move on to the next task. Typically I use ng serve to run the application as I am developing.
With Server-side rendering, to test speed, lazy-loaded images, etc, you need to use a node express server running on a generated JS file. After building, etc, I use Node prerender (my js file is prerender.js) to see what the application will look like prerendering on the server.
When I run this command, I should not get any errors, and I know my prender file will start a local server on port 4000.
The Problem
I get errors when running a node express server that I do not get when running with ng serve I recently got an error that said:
Unhandled Promise rejection: Cannot read property 'subscribe' of undefined ; Zone: <root> ; Task: Promise.then ; Value: TypeError: Cannot read property 'subscribe' of undefined
at new ApplicationRef (C:\4towerdevelopment\dist-stage\server\main.js:45910:37)
at _createClass (C:\4towerdevelopment\dist-stage\server\main.js:37184:20)
at _createProviderInstance (C:\4towerdevelopment\dist-stage\server\main.js:37138:26)
at initNgModule (C:\4towerdevelopment\dist-stage\server\main.js:37044:32)
at new NgModuleRef_ (C:\4towerdevelopment\dist-stage\server\main.js:38176:9)
at Object.createNgModuleRef (C:\4towerdevelopment\dist-stage\server\main.js:38159:12)
at NgModuleFactory_.create (C:\4towerdevelopment\dist-stage\server\main.js:50821:25)
at C:\4towerdevelopment\dist-stage\prerender.js:29175:43
at ZoneDelegate.invoke (C:\4towerdevelopment\dist-stage\prerender.js:481:26)
at Object.onInvoke (C:\4towerdevelopment\dist-stage\prerender.js:28683:33) TypeError: Cannot read property 'subscribe' of undefined
at new ApplicationRef (C:\4towerdevelopment\dist-stage\server\main.js:45910:37)
at _createClass (C:\4towerdevelopment\dist-stage\server\main.js:37184:20)
at _createProviderInstance (C:\4towerdevelopment\dist-stage\server\main.js:37138:26)
at initNgModule (C:\4towerdevelopment\dist-stage\server\main.js:37044:32)
at new NgModuleRef_ (C:\4towerdevelopment\dist-stage\server\main.js:38176:9)
at Object.createNgModuleRef (C:\4towerdevelopment\dist-stage\server\main.js:38159:12)
at NgModuleFactory_.create (C:\4towerdevelopment\dist-stage\server\main.js:50821:25)
at C:\4towerdevelopment\dist-stage\prerender.js:29175:43
at ZoneDelegate.invoke (C:\4towerdevelopment\dist-stage\prerender.js:481:26)
at Object.onInvoke (C:\4towerdevelopment\dist-stage\prerender.js:28683:33)
The closest this gets me to figuring what actually is causing the problem is letting me know that a provider somewhere is causing this error. Looks like something should be an observable rather than a subscription. Beyond that, I guess I just start looking through my providers. My question is:
How can I force Angular to possibly throw this error when developing using ng serve?
If I can't, is there a better way to debug this current error besides combing through each provider? Or at least a way to tell what service is causing the issue?
Thank you.
UPDATE: Basic repo with problem here. I made a new angular project, made sure dependencies were up to date, installed ngUniversal per this post, and received this same Unhandled promise message when running node prerender
Verbatim I went to to the Angular cli website, made a new project (default Angular version installed was 8.3), installed Angular Universal, and tried to build. Same error message as above.
This looks like it was ApplicationRef that triggered the error, and that class is provided internally by the Angular core.
It could be failing in the constructor of the class, and there are a few calls to subscribe on Zone observables. I don't think you're going to find anything in your source code that directly relates to this error. It looks like a build configuration problem.
https://github.com/angular/angular/blob/bb52fb798c8578c461d21aee2b7623232184a5d3/packages/core/src/application_ref.ts#L562
I do not know what could possibly produce this problem, but I would start a new project with SSR and compare the differences to your current project.
Eventually, I dropped the angular 6 approach using pre-render, and went with the latest universal package. There seems to be no problem building using npm run build:ssr and serving dist/server.js in an express server. I am not sure what the problem was with the pre-render approach, but it seems to be outdated anyways. #Reactgular thanks for the feedback.

Old Enum Behaviour is used, please upgrade to the new one

I'm encountering this weird message out of blue on my Node server (Express + GraphQL) in the terminal window. Message doesn't say where it comes from.
Anyone experiencing this problem or any idea why it's happening?
Github Issue in Typegoose Repository
Typegoose is changing how it handles enum properties, and the old behaviour is deprecated.
Check for breaking changes
If you are working on an existing project, then review the documentation to ensure your app and DB will be compatible with the new behaviour:
Enum properties
useNewEnum flag
Opt-in to the new enum behaviour
Run the following as early as possible in your start-up code:
import { setGlobalOptions } from "#typegoose/typegoose";
setGlobalOptions({
globalOptions: {
useNewEnum: true,
},
});
If you still get the warnings, then try the following:
Ensure the code is running before any other app start-up logic
Run the code before any other imports

Mean.io graphql don't allow me to insert new record in a new schema

I am just a newbie in mean.io . I want to build an event module just like the post which can be found the default module when you make an installation. I have taken everything from the post and renamed it as event. Now when I am trying to insert a new record in the event schema its showing an error like
there was an error sending the query Error: GraphQL error: Unknown type "EventInput". Did you mean "PostInput"?
GraphQL error: Cannot query field "addEvent" on type "Mutation". Did you mean "addPost"?
So can someone tell me what I am doing wrong here? Any suggestion or help will be really appreciable.
The problem is with innograph.
The addPost is coming from this npm module and not the actual /server/ changes that you have made.
innograph is initialised in express.js
The solution is to copy the innograph code into you application. Make all the changes and actually remove innograph from package.json.
If its too much just remove innograph, graphql, apollo packages and then simply use express.js that is also pre-built into mean.io.
The second step requires changes to be made into /server/ folder. I had to do some debugging to actually make it work.

Sails Upgrade v10.5 Waterline "Migrate - safe" option gives errors?

When I upgraded Sails from V0.9 to V0.10 I ran into trouble with Waterline. I have exhausted my options as far as finding the solution online. The problem is:
Sails v0.10 ask for the migrate property to be set and I do set it inside my models.js config file - migrate:"safe".
My server console keeps giving me the following error:
node_modules/sails/node_modules/waterline/lib/waterline/core/validations.js:77
Object.keys(attrs[attr]).forEach(function(prop) {
TypeError: Object.keys called on non-object
Did anybody else run into this problem?
I realized after a bit that I had earlier added the following to my models. After removing it, I was able to run sails lift with no problems. Maybe check your models to ensure that everything is kosher.
autoCreatedAt: true,
autoUpdatedAt: true

Resources