NPM response after creating new Vue JS project - windows

I would like someone to please explain to me three things I get after creating new Vue JS project. NPM is giving me few warnings that would like to understand.
1- 83 packages looking for fund.
2- (69 vulnerabilities (2 low, 57 moderate, 10 high)).
Image for point 1 and 2
3- The different warnings I get when I run (npm audit fix --force) as it says.
Image for point 3
So, do I need to worry about those errors? My project is successfully built but while watching others do it on YouTube they don't get those errors or heads-up or whatever it's called.
I'm using windows 10 PowerShell terminal and I have Node and npm installed and Vue JS 3 installed globally noting that also while installing it I got few of the same errors but it works as well.

To answer my own question, Those notifications can be ignored if you're sure that your npm is updated and node is updated.

Related

BaseApplicationCustomizer throws errors

So today I was updating one of our SPFX extensions to use the latest spfx framework (1.16) with node (16.13) and after finishing my updates I got the following inside my code:
I am not exactly sure why these are not coming in, I suspect the newest version of spfx moves these classes out of sp-application-base, but why? and where is the documentation for it? Because there is this link that is only 6 months old and explains to use this code for the top and bottom headers.
I was expecting this code to remain in sp-application-base, but it appears it isn't in that package.
How did you perform the upgrade? I highly recommend using the Microsoft 365 CLI to upgrade projects, as the developers of that app do thier best to cover every part of the project that needs to change. Learn more at https://pnp.github.io/cli-microsoft365/cmd/spfx/project/project-upgrade/
Here are the commands to run from the root of your project
npm install -g #pnp/cli-microsoft365
m365 spfx project upgrade --output text
This will give a list of npm commands and code update instructions to follow. See the above documentation for other options for output and use whatever works best for you.
It is still there. What version of #microsoft/sp-application-base is in your project? Should be 1.16.1 I believe. I will say that I am new to all of this as well, but I am using the latest framework and VS is not flagging any issues with these.

Displaying Most NODE_OPTIONs are not supported in packaged apps error after npm command

"Most NODE_OPTIONs are not supported in packaged apps. See documentation for more details." error is displaying in the vs code console after I enter the npm.
This issue comes up after I installed cypress version 9.4.1. The code is running fine but every time I run the code this error message comes up.
Why this issue is displaying and can someone explain to me how to fix this, please?
I solved this problem
But the point is that I use Angular version 14
I run the command ng e2e to solve this problem
Then I selected cypress among the suggested options in the command line

Nextjs project is not hot reloading in MacOs

Well, i try searching a solution but i cant find anything.
A coworker passed me project in NextJs (With React of course). I run yarn install, and then yarn run dev, the server starts but when i made a change in the code, it is not hot reloading! I have to stop and start the server manually each time.
I tried sudo yarn run dev, i tried with npm, y tried a lot of things.
I dont know much about MacOs, i just bought this days ago... The project work perfect on my Windows machine.
This are my current node and yarn version on mac
devmcgann#MacBook-Pro-de-Gabriel instashop-webapp % node --version
v12.16.1
devmcgann#MacBook-Pro-de-Gabriel instashop-webapp % yarn --version
1.22.4
Edit: I tried making a simple react app and hot reload work perfect there.
But with nextJS the problem persists
Thanks!
I had similar issues. The problem was the incorrect imports.
Some of my files and folder were in lowercase but in imports I was using uppercase.
Even though the build is successfully done without error, the hot reload doesn't work. So I had to correct them in order to make them work.
Make sure your routes case matches the case of the folder.
Make sure the component name has to start with the upper case. If your file name is dashboard.jsx, the component name should be Dashboard.
// home/dashboard.js
const Dashboard = () => {
....
}
export default Dashboard
Well.. This is rare.
Yarnd install and also npm install. I didnt now that i will need both.
Fixed.

compilation successfully while running the command npm run watch on compute engine but no any changing effects

Compilation successfully while running the command npm run watch on compute engine ubuntu terminal but no changing effects. I use the Larave+Vue project hosted on the Ubuntu VM instance on GCP. I search much time for this issue but not able to find any solution. I found a similar problem on StackOverflow but there is no answer to solve my problem. Please check the link below:
I am using Putty to run and compile vue js + laravel app on Godaddy VPS. Changes are not taking effect
Please help...
Thanks in advance.
Maybe try npm run watch-poll instead, on certain systems watch doesn't trigger changes but wacth-poll will periodically checks (polls) for changes.

Using Babel in Production - How to precompile scripts

I'm building an application using Oracle Application Express (APEX) [so no existence of Node].
I have two issues which are somehow related concept-wise.
Issue #1:
I've included the React.js library in all of my pages to use some of its features.
I'm using babel to convert my JSX to simple JS. Everything's working fine.
But I keep on getting this warning in my console :
You are using the in-browser Babel transformer.
Be sure to precompile your scripts for production - https://babeljs.io/docs/setup/
I know I must precompile my scripts but I have no idea how. I visited the link and it got me all the more confused.
Issue #2:
The other issue I have is that I've got all my react related code in a separate .js file and I have embedded it in my page using this :
<script src="someJSFile.js" type="text/babel"></script>
Setting the type to "text/babel" raises this warning :
Fetching scripts with an invalid type/language attributes is deprecated
and will be removed in M56, around January 2017.
See https://www.chromestatus.com/features/5760718284521472 for more details.
Is there any workaround for this issue?
Issue 1: This is linked to what ever bunlder you choose (see issue 2 below). Which ever you do choose, will allow you to set the node env to production, which will put React in "production" mode - basically scraping out all the unneeded (but helpful) development messages and checks.
Issue 2: You will need some module bundler at the end of the day. Webpack is the goto at the moment. Webpack Site
Alternatives include:
Gulp + Browserify
Rollup
EDIT: I know you said "no node". You won't need node to run anything on the server, only on your local machine where you build the files. Node is easy to install on pretty much any local machine

Resources