all! I currently met a difficulty with my project. I want to modify the code of a component from a UI library (like Semantic-UI, Material-UI). What I do now is just edited the code from the node_modules. But the reality is no matter how I change the code from node_modules, my project will not be affected. Why this will
Well that's because most modules have build process which you need to run before using them. Also editing a module directly is not a good idea because any change you do to them is guaranteed to be lost after next npm install.
As Vuetify is a MIT licensed, I suggest to fork its GitHub project and then publish it as your own npm package.
Related
I am studying React.js., and I have started by setting the project folders to try some codes. But, some terms are confusing me as a beginner. One of them is "dependency." When I search for it, the result is only related to dependency injection stuff, but what is the "dependency" itself?
A dependency is some third-party code that your application depends on. Just like a child depends on its parent, your application depends on other people's code. A piece of code becomes a true dependency when your own application cannot function without it.
If you want to look at the dependencies you're using, you can find them in the package.json file under the dependencies key.
Well, dependencies are those things that you need to install and import for doing specific things, for example, if you want to add routing(moving from one page to another which changes your URL) in your react project then you need to install react-router-dom dependency by doing
npm install react-router-dom
A dependency is just a package that your project uses.
Very few javascript projects are entirely self-contained. When your project needs code from other projects in order to do its thing, those other projects are "dependencies"; your project depends on them to run.
When you install third-party packages via npm install <package>, you're adding a dependency.
Your project's package.json file includes a list of your project's dependencies.
I'm working on a Vue.js project and I run into something the Bootstrap-vue module does that I'd like to get rid of. I located the place in the module that causes the behavior and commented it out. However, this is not reflected on the project. Did I miss a step here?
Firstly, never a good idea to alter your node_modules packages directly,
if you want to see the changes then run yarn install or npm install depending on what package your project is running on, after that run your local serve and changes should have taken effect
Side note: if you are working within a team or peer programming then I would not advise the altering of your node_modules, as the package.json would just overwrite the the changes on their side if using a Git environment to share code
I've followed the instructions in this URL (https://github.com/react-component/calendar) to install a component app in my dependencies. I have succesfully installed it, imported it and it is visible and usable in my web app.
npm install rc-calendar
import Calendar from 'rc-calendar';
<Calendar />
However, I can't seem to edit it or find a 'Calendar.js' file to make changes to it? I'm able to see it in my package.json file but not more than that
You'll find the source files in your node_modules folder in your project. But I would not edit them there. If you want to use that plugin as a starting point and edit it from there, I recommend downloading the source files from the github repo and including it in your project as a regular .js file / regular component. Then you can edit from there. It looks like that plugin has many files that are written in typescript.
TL;DR You can, but you shouldn't.
When you use npm it's supposed that you don't change those packages, what you can do is create your own version. If you want to find the source code, some packages come with it, you'll find it in: <project folder>/node_modules/rc-calendar.
The typical convention is to not edit packages installed via npm . However, you can clone the package repo and include it in your project. There, you can do what ever you want.
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 2 years ago.
Improve this question
In the past, I made some websites with notepad for example, so we must create a folder TREE and put into it a .htm file, and some folderS with stuff like Javascript, css ...
Maybe I don't understand what NPM really brings, because It seems to do the same thing but automated it ... is it just that ?
For example, why not just unpack a frameworks (e.g. Bootstrap or Kube) without use of NPM and so have folders ready to use ?
Help me to understand please because I'm near the crazy state with all this stuff ...
npm is a package manager for Node.js with hundreds of thousands of packages. Although it does create some of your directory structure/organization, this is not the main purpose.
The main goal, as you touched upon, is automated dependency and package management. This means that you can specify all of your project's dependencies inside your package.json file, then any time you (or anyone else) needs to get started with your project they can just run npm install and immediately have all of the dependencies installed. On top of this, it is also possible to specify what versions your project depends upon to prevent updates from breaking your project.
It is definitely possible to manually download your libraries, copy them into the correct directories, and use them that way. However, as your project (and list of dependencies) grows, this will quickly become time-consuming and messy. It also makes collaborating and sharing your project that much more difficult.
Hopefully this makes it more clear what the purpose of npm is. As a Javascript developer (both client-side and server-side), npm is an indispensable tool in my workflow.
NPM basically is the package manager for node. It helps with installing various packages and resolving their various dependencies. It greatly helps with your Node development. NPM helps you install the various modules you need for your web development and not just given you a whole bunch of features you might never need.
NPM is a Node Package Manager and it's use for
it is an online repository for the publishing of open-source Node.js
projects.
Command line utility to install Node.js packages, do version
management and dependency management of Node.js packages.
NPM is a node package manager. It is basically used for managing dependencies of various server side dependencies.
We can manages our server side dependencies manually as well but once our project's dependencies grow it becomes difficult to install and manage.
By using NPM it becomes easy, we just need to install NPM once for all dependencies.
npm is Node's package manager. It's a repository of hundreds of thousands of useful pieces of code that you may want to integrate with your Node project.
npm also has a command line tool that lets us easily install, manage and run projects.
Use npm to . . .
Adapt packages of code for your apps, or incorporate packages as they are.
Download standalone tools you can use right away.
Run packages without downloading using npx.
Share code with any npm user, anywhere.
Restrict code to specific developers.
Create Orgs (organizations) to coordinate package maintenance, coding, and developers.
Form virtual teams by using Orgs.
Manage multiple versions of code and code dependencies.
Update applications easily when underlying code is updated.
Discover multiple ways to solve the same puzzle.
Find other developers who are working on similar problems and projects.
READ MORE here
It stands for Node Package Manager
There are a ton of packages out there that have this all bundled up but I dont like the way they set up the projects and such so I was reading the Reactjs docs on installing with npm and my confusion is:
After installing it using npm install react or adding react to
package.json
Do I add this to the "devDependencies": {} or ...
for the require statement to work, do I need to include requirejs?
Can I just do grunt serv to start everything and auto compile the jsx or do I need to do this? (it seems like that might be answered for me ..... but how can I get it to auto compile the jsx when I run grunt serv)
I ask these questions and state I don't like the existing yo ... commands for this because they don't play nicely with bacbone.js So I was going to set this up my self. if there are any repos out there for yeoman that do this for me please point me to them.
dependencies vs devDependencies: for npm package.json, devDependencies are mainly used for the tooling around working on the project itself: testing tool chain and project building modules, for example. Things you'd often see in there: Mocha, Grunt, etc. So mostly for repo contributors and alike. As a consumer of React, you'd put it in dependencies, which are for modules that your code actually needs in order to work.
require isn't for requirejs. The naming clash is unfortunate. require() is part of CommonJS. Node uses CommonJS. Browserify too. Here, it's assuming that you're using Browserify, or maybe doing server-side React with Node.
I'm not sure what you've set up to use with grunt serve. There's nothing magical that makes it work by default. You do need to do what the link said. The --watch option will look for changes to your files and auto compile the jsx to js.
Hope that helps!