I am currently working on a website project using javascript. I am unable to call the socket.io module, which I installed using npm install socket.io.
I tried to use it in the HTML script:
<script src="/socket.io/socket.io.js"></script>
But I got an error, apparently because the module is not found.
I didn't find any other way to install it on the internet. Does anyone know a way to avoid this problem?
When you do npm install socket.io, the socked.io library is installed to a special directory called node_modules.
In your HTML file, you are trying to load the library from a path that expects it to be located in a subdirectory called socket.io in the public documents directory of your server.
You have three options:
copy the socket.io library to a directory where your server can serve it and the browser can find it
adjust the path in your script tag to point to node_modules/socket.io
load socket.io from a CDN, for example:
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.1.1/socket.io.js"></script>
I would recommend the third option.
You can install it globally using -g parameter:
npm install -g socket.io
If you don't want to do the above then you need to run the project using local node_modules dependencies. To do that:
Add the following alias in ~/.bashrc alias npm-exec='PATH=$(npm bin):$PATH'
Run all npm commands by prefixing npm-exec to use local node modules
Example: npm-exec npm build
Related
Currently I'm working on a .NET core MVC app wired up with yarn to add packages. So far I've added the Signalr package like this:
yarn add #microsoft/signalr
Which adds the package to /wwwroot/lib/#microsoft/signalr/etc..
However when I try to include the package in the Web app it gets stuck. I'm including it like this:
<script src="lib/#microsoft/signalr/dist/browser/signalr.js"></script>
also <script src="lib/microsoft/signalr/dist/browser/signalr.js"></script> does not work.
Anyone knows how to fix this? We do not want to switch to libman and prefer to keep using packages with Yarn.
Cheers!
Firstly, you need know that Yarn will not install the client side package to your wwwroot by default.
It globally downloads the package in %UserProfile%\AppData\Local\Yarn\ folder.
In my PC, it exists in C:\Users\username\AppData\Local\Yarn\Cache\v6:
The whole working steps
Be sure you have installed note.js, then run following command to install Yarn :
npm install --global yarn
Run command to add signalr package:
yarn add #microsoft/signalr
Find the signalr package(#microsoft folder) in %LOCALAPPDATA%\Yarn\ and copy the whole #microsoft folder:
Paste the whole #microsoft folder to your project wwwroot/lib folder:
Then add the js reference like below:
<script src="#Url.Content("/lib/#microsoft/signalr/dist/browser/signalr.js")"></script>
Actually I suggest you can use Libman, it can directly download to your wwwroot folder.
You cannot use the package like that in your Webclient.
Everything you want accessible from your Client must be served by your Server.
Serving a Package is a bit more tricky and I would recommend using a bundler.
With Webpack for example you can prepare your client Resources to be served.
In practice this can look like this:
Webpack is configured to bundle your Client Javascript and put it in <project-root>/assets
Your server is configured to serve every file from the <project-root>/assets directory to the /assets route.
In your client script file you import your library module like so:
import {<your needed parts>} from '#microsoft/signalr';
Finally your html page loads your client script like so:
<script src="/assets/bundle.js" type="module"></script>
This is a simplified example and i would recommend you to read the Webpack docs.
A client would like to use an npm package to access our JavaScript file's functions instead of adding a script tag to their html. Is this possible? The only resource I've come across for creating an npm package is for NodeJS files (https://docs.npmjs.com/creating-node-js-modules).
This is possible but you cannot import the npm package and have it work in the browser without some sort of bundling system like webpack.
Alternatively, which is a bad idea, would be to ship your dist folder with node_modules in it. This isn't recommended for a multitude of reasons, but it will work.
Following approach might be suitable for your client's requirement.
Create a NPM project using the javascript file you have
Publish it on client's Github account as a package.
Create a .npmrc file in root of your client's project.
Add your package in .npmrc file and in packages.json both.
Refer this doc for using a package with .npmrc file:
https://docs.github.com/en/packages/guides/configuring-npm-for-use-with-github-packages#installing-a-package).
If I'm developing a library which work is based a lot around of current working directory and the filesystem generally, a lot of paths resolution, and I want to see how it will behave when will be installed as a node module, I don't want to get unexpected results when I'll upload it to the npm. How do I test my library behavior pretending it's a node module? Is placing its folder in node_modules enough?
Make a local package and install it everywhere:
$ npm pack
it will generate a zipped file, so you can copy somewhere and install it.
// another project
$ npm install /path/to/pack
Resources:
npm pack,
Add local package
Absolutely you can use npm link too. link
When I run npm install -g <package> it installs the packages in my user/AppData/Roaming/npm/npm_modules/ folder. This sub-folder is not in my PATH so if I try to run the package without explicitly calling the entire path the call fails with a '<package>' is not recognized as an internal or external command, operable program or batch file.
What can I do to fix this?
Thanks
I'm using win8.1 and I found that the nodejs installer didn't add the path to global node modules to the system PATH. Just add %AppData%\npm; to the user variable(since %AppData% dir is depending on user) PATH to fix it.
You will need to log out then log back in for the change to your PATH variable to take effect.
SET PATH=%AppData%\npm;%PATH%
You have to run this line SET PATH=pathtonodejs;%PATH% (where pathtonodejs is where you installed nodejs) once the installation for nodejs is complete and it should work.
It turned the problem was a change in behavior of the module I was using.
I'd been following old tutorials for using Express.js. The old tutorials assumed Express would be in my path after installing it globally, but as of Express v4.0 there's a separate Express module you have to install in order to get it in your path
I am working on a project for an embedded Linux system (busybox made with buildroot). I am wondering if it is possible to use node.js modules socket.io and express without having to install or run npm. The goal is to be able to have buildroot configured to create a busybox image that simply includes node.js, and then place all my javascript files in the proper directory and execute node app.js from the command line to run the node application (which will use socket.io and express).
So, for example on my development machine (That does have node.js and npm installed), I could run npm install socket.io so it would get socket.io and all its dependencies and install it in the node_modules directory of my project. If I place all those files in a directory and move them to the production environment (embedded Linux with just node.js installed and where npm install socket.io was never run) would my application work?
If I place all those files in a directory and move them to the production environment would my application work?
Yes, it would. However, if you do have any binary dependencies, they need to be recompiled, so it's a bit trickier. If you don't, you'll be fine.