https://www.cnblogs.com/goldlong/p/8027997.html
First clarify the relationship between nodejs and npm:
Node.js is a running environment of javascript, which is the encapsulation of Google V8 engine. Is a server-side javascript interpreter.
Inclusion relationship, nodejs contains npm, for example, if you have installed nodejs, you open cmd and enter npm -v, you will find the version number of npm on the line, indicating that npm has been installed.
Quoting the summary of the Great God:
In fact, npm is the package manager of nodejs. When we develop on Node.js, we will use a lot of javascript code that others have written. If we need to search for other people's code by name, download the source code, unzip it, and use it again, it will be very troublesome. So there is the package manager npm. Everyone uploads the source code written by themselves to the npm official website. If you want to use one or some of them, you can install it directly through npm, regardless of where the source code is. And if we want to use module A, and module A depends on module B, and module B depends on modules C and D, npm will download and manage all dependent packages according to the dependencies. Just imagine how troublesome it would be if we did all this work on our own!
node -v to view the node version, and the built-in npm package manager is included to install dependent packages.
npm install -g typescript
1. Before using it, let's first grasp what the three things are used for.
npm: Package manager for Nodejs.
webpack: Its main purpose is to prepare all the static resources that need to be published on the browser side through CommonJS syntax, such as merging and packaging resources.
vue-cli: User-generated Vue project template. (To help you quickly start a Vue project, that is, to give you a set of Vue structure, including basic dependency libraries, you can install it with npm install)
Start:
As shown in the figure, download 8.9.3 LTS (recommended for most users)
Double click to install
You can use the default path, which is modified to d:\nodejs in this example
Point all the way Next
Click Finish to complete
Open CMD and check if it is normal
Let's take a look at the other two directories. The local repository of npm runs in the user directory of the system disk c drive (npm-cache is not seen because it has not been used, it is generated as soon as the cache directory is used), we try to put these two Move the directory back to D:\nodejs
First create 2 directories as shown below
Then run the following 2 commands
npm config set prefix "D:\nodejs\node_global"
npm config set cache "D:\nodejs\node_cache"
As shown above, let's pay attention to the local repository of npm again and enter the command npm list -global
Enter the command npm config set registry=http://registry.npm.taobao.org to configure the mirror site
Enter the command npm config list to display all configuration information, we focus on a configuration file
C:\Users\Administrator\.npmrc
Edit it with a text editor and you can see the configuration information just now
Check if the mirror station works or not Command 1
npm config get registry
Check if the mirror station is OK Command 2
Npm info vue to see if you can get vue information
Note that at this time, the default module D:\nodejs\node_modules directory
will change to D:\nodejs\node_global\node_modules directory,
If you run commands such as npm install directly, an error will be reported.
We need to do 1 thing:
1. Increase the environment variable NODE_PATH content is: D:\nodejs\node_global\node_modules
(Note that the following operations need to reopen CMD for the above environment variables to take effect)
一、测试NPM安装vue.js
命令:npm install vue -g
这里的-g是指安装到global全局目录去
二、测试NPM安装vue-router
命令:npm install vue-router -g
运行npm install vue-cli -g安装vue脚手架
编辑环境编辑path
对path环境变量添加D:\nodejs\node_global
win10以下版本的,横向显示PATH的,注意添加到最后时,不要有分号【;】
重新打开CMD,并且测试vue是否使用正常
注意,vue-cli工具是内置了模板包括 webpack 和 webpack-simple,前者是比较复杂专业的项目,
他的配置并不全放在根目录下的 webpack.config.js 中。
初始化,安装依赖
运行npm install安装依赖
npm run dev
成功界面,提示打开地址http://localhost:8080
自动打开浏览器http://localhost:8080/#/
npm run build
生成静态文件,打开dist文件夹下新生成的index.html文件
nmp下新建出来的vue01的目录描述: