I am using NestJS and IIS, and I have deployed my dist folder on server through IIS with the help of IISNode, but when I run it, it gives me an error of 'module not found #nestjs/core' etc, so I installed entire package.json files (node_module) on server, after this it start working fine. But I have a question.
Do we have to keep node_modules folder on the server which is of 250MB+?
Do we have any other alternative by which dist will contain all the required code of node_modules just like an Angular application?
This is not NestJS related, but it is related to NodeJS itself. A typical package.json file looks like this:
{
"name": "nest-typescript-starter",
"version": "1.0.0",
"description": "Nest TypeScript starter repository",
"license": "MIT",
"scripts": {
// ...
},
"dependencies": {
"#nestjs/common": "8.2.3",
// ...
},
"devDependencies": {
"#nestjs/cli": "8.1.7",
// ...
}
}
Everything under dependencies are required at runtime, since they're being used by your application. Anything under devDependencies are only required during development, for various reasons.
It is common to have devDependencies like type modules, testing tools, and others.
While installing a new dependency, you have two options:
# Option 1
npm install <dependency name>
# Option 2
npm install --save-dev <dependency name>
If you provide the --save-dev flag you would install that dependency under devDependencies.
After making your package.json file organized, separating devDependencies from dependencies you can deploy your application properly. During the deployment process, instead of running npm install you can use:
npm install --omit=dev
By doing so, you would only install runtime dependencies to your node_modules.
Finally, you can copy that node_modules to your container (or whatever you're using to deploy) and ship the application.
Related
I have an app and I have a storybook. They both live inside the same app at the moment. I have just installed Lerna and played around so I can treat them both as 2 separate packages.
Both packages will be dockerised and when I build one, it should not do anything with the other
my structure so far:
app/
package.json
lerna.json
makefile
packages/
my-app/
all-relevant-packages-for-my-app
package.json
storybook/
all-relevant-packages-for-storybook
package.json
I don't want to publish anything to NPM. I simply want to use these packages separately but I would like to import app components into the storybook
is Lerna the correct thing to use here?
when I run say docker build my-app it should go inside the my-app repo and then build the docker image etc, run tests and deploy my app to S3 (this is all set up already) but now I've moved it all I'm wondering if Lerna is the correct tool as I see lots about publishing to NPM
You don't have to use Lerna in your case. I'd recommend you to use Yarn Workspaces. Let's install yarn and then add
"workspaces": [
"packages/*"
],
section to your main package.json file. From now on, yarn will be handling packages dependencies.
In your case - please enter the package.json of my-app and change its name to e.g. `#app/my-app'. Check the version of my-app in package.json (I will assume its 1.0.0 for now).
Do the same with storybook changing its name to e.g. #app/storybook. Then you can add a dependency in storybook's package.json file:
"dependencies": {
"#app/my-app": "1.0.0"
...
}
Go back to the root directory app and run yarn command. It will resolve all dependencies for all packages. Now you can use my-app inside storybook without the necessity of using Lerna.
I'm having problems with my home-rolled NPM module as when installed it installs most of it's dependencies in the applications node_modules directory, instead of containing it inside the module itself.
Ex;
APP
node_modules
MY_MODULE
node_modules
<ALL deps from MY_MODULE should be installed here>
<SOME/MOST deps from MY_MODULE are installed here>
The above causes issues because I have dependencies that require a specific version that's installed under MY_MODULE/node_modules and NOT under MY_APP/node_modules.
For instance; I have Webpack 3 installed under APP/node_modules but MY_MODULE requires Webpack 4 and that is installed under MY_MODULE/node_modules as you would expect.
But everything else, that requires Webpack 4, is installed under APP/node_modules and thus gives an error message.
So, in the app I have a package.json:
devDependencies: "webpack": "^3.12.0",
And in my NPM module I have a package.json:
"dependecies": [
"webpack": "^4.12.0",
"webpack-cli": "^3.0.8",
]
webpack-cli is installed under APP/node_modules and thus complains that it requires Webpack 4 and that it couldn't be found.
if webpack-cli instead installed itself under APP / node_modules / MY_MODULE / node_modules it would work.
How can I get it to do that?
Thanks,
/J
<ALL deps from MY_MODULE should be installed here>
They shouldn't. This was true for NPM v2. This behaviour had been changed in NPM v3, and now it's v6.
In case dependencies have dependencies with different version constraints that can be satisfied with single webpack (which is one of the reasons why node_modules was flattened in NPM v3), there will be:
node_modules/webpack
Otherwise there will be multiple dependencies that will be used by packages that depend on them:
node_modules/webpack#3.12.0
node_modules/webpack#4.12.0
I'm running an Angular app built with Grunt and using Bower and NPM.
I tried installing my npm module locally. The files are in the main app directory in node_modules folder.
The module docs ask me to load the module with <script type="text/javascript" src="node_modules/moment/moment.js"></script>, but I get 404.
Am I missing something? Do I have to tell Grunt that I want these NPM modules?
Can you provide more information on what your app is built with? If node serves your app, you need to make the directory you link to public. Assuming you're using express, this would look something like this in your app.js file:
app.use('/node_modules', express.static(__dirname + '/node_modules/moment/moment.js'));
Edit:
Or if you just want to make it work, try to load moment.js from CDN like this:
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.js"></script>
Link to moment on CDN
Basically, npm is the package manager for all the javaScript frameworks such as Nodejs, angularjs etc. npm should be installed globally in the machine.You can install it from https://nodejs.org/en/ .
Next,you need check for the package.json file in your project.
If there is a package.json already existing in your project folder, then from command line you need to go to your project folder and type npm start.
If package.json file does not exist, then in the command line type npm init,then there will be a package.jsonfile created in your project folder.Then edit the package.json . and add the node packages into the package.json as similar way to this
{
"name": "shoppingkart",
"version": "0.0.0",
"private": true,
"scripts": {
"start": "node ./bin/www" //If you have any scripts.
},
"dependencies": {
"mongoose": "^4.9.0", // here you should have all your node_modules listed
"passport": "^0.3.2",
"stripe": "^4.15.1"
}
}
if you are not able to add the dependencies to json file, there is also another way to do it.
just go to your project directory in the command line and type
npm install --save grunt // And you need to do for all the node_modules, by replacing the **grunt**.
Automatically the dependency will be added to your package.json file.
If you installed your npm packages locally then your node_modules folder should found at the root of your project.
If you installed all your packages globally you may not see an npm_modules folder in your project.
To see where your global modules are located you can run
npm list -g
I faced the same issue just install the package globally and save at the end.
Like:
npm install -g <package> --save
Even the above doesn't work then use -f / --force at the end to force install.
I saw many repo, that contains dist folder. Why? I think repo should store only source code, without any builds and so on.
Let's look at follow example with ES6 code.
package.json
{
"files": [
"dist",
"lib"
],
"scripts": {
"build:lib": "<transform ES6 to ES5 and put it to ./lib folder>",
"build:umd": "<make a umd module and put it ./dist folder>",
"build": "npm run build:lib && npm run build:umd",
"postbuild": "<make minify code>"
"prepublish": "npm run build"
}
}
I think this is a good way. And I saw several repo that do the same. In this situation github repo would store only src and npm repo only lib and dist.
And now another question. Why store dist and lib in npm? Most libraries can be installed by executing npm install command. And how we know prepublish script runs on local npm install (npm-scripts).
So after package have installed we have lib and dist folders.
I don't understand why store this code in npm if only source code is enough?
It appears that repositories include dist directories in order to enable other projects to use them as direct dependencies via git. Compare package.json docs, though as of now this doesn't mention that artefacts need to be present.
Compare NPM: Missing dist and src directories when trying to install directly from a github url for the problem that arises if the dist directory is not checked in.
Alternatively, it is also possible to install from a Git repository directly as long as a prepare stage which builds the package is provided:
{
...
"scripts": {
...
"prepare": "npm run build"
},
...
}
This way, you won't have to store /dist folder in the repository itself
I just created a component for React-Native that I will push soon to npm as a package. Although I'm facing an issue.
The component is dependent of another npm package called react-native-image-resizer. This package needs to be linked with rnpm in order to work.
Although, when I just install my component in a brand new project, the dependency won't be linked automatically, and the native library won't appear in the project. Of course, when I run rnpm link, it won't add it to the project either.
So I'm wondering what would be the best way to install and link this dependency?
MacBook-Pro:Example $ npm install react-native-image-crop
> react-native-image-crop#1.0.0 preinstall /Users/alexmngn/Work/react-native-image-crop/Example/node_modules/.staging/react-native-image-crop-95365d1b
> npm install --save react-native-image-resizer
react-native-image-crop#1.0.0 (git+ssh://git#github.com/alexmngn/react-native-image-crop.git#90e002c7d0f01c9d61277c30cad375560f09a94a) /Users/alexmngn/Work/react-native-image-crop/Example/node_modules/.staging/react-native-image-crop-95365d1b
├── UNMET DEPENDENCY react-native#^0.31.0
└── react-native-image-resizer#0.0.9
npm WARN react-native-image-resizer#0.0.9 requires a peer of react-native#>=v0.14.2 but none was installed.
npm WARN react-native-image-crop#1.0.0 No repository field.
- react-native-image-resizer#0.0.9 node_modules/react-native-image-crop/node_modules/react-native-image-resizer
Example#0.0.1 /Users/alexmngn/Work/react-native-image-crop/Example
└── react-native-image-crop#1.0.0 (git+ssh://git#github.com/alexmngn/react-native-image-crop.git#90e002c7d0f01c9d61277c30cad375560f09a94a)
MacBook-Pro:Example $ rnpm link
MacBook-Pro:Example $ # Nothing gets linked here...
Also, as you can see up there, I have an unmet peer dependencies issue with react-native when I install my component in my example project, even though it is listed properly (with the right version) in my dependencies in package.json:
{
"name": "Example",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start"
},
"dependencies": {
"react": "15.2.1",
"react-native": "^0.31.0",
"react-native-image-crop": "git+ssh://github.com/alexmngn/react-native-image-crop.git"
}
}
Any idea why it complains?
Repo of the component available here: http://github.com/alexmngn/react-native-image-crop.git
Thanks
The rnpm link only links packages it found in package.json, generally these packages are installed via command rnpm install or npm install --save.
In order to automatically do this for those who install your package, you can write a preinstall npm script which will be executed before the package installed.
In thepackage.json add scripts block like this
{
"scripts": {
"preinstall": "npm install --save react-native-image-resizer#0.0.9"
}
}
After doing this, when someone try to install your pacakge via npm, react-native-image-resizer will be installed first, and also add leave ab entry to package.json -> dependency so that rnpm link can work correctly.
Read more information about npm script