nodejs+npm的安装与配置
目录下载与安装下载安装配置nodejs相关配置npm相关配置nodejs的基本使用搭建简易后端服务器npm的基本使用搭建vue 2.0开发环境下载与安装下载点击_Node.js中文网_根据自身系统进行下载即可安装点击下载的安装包进行安装选择安装的路径位置下一步、没有特殊要求默认即可该选项建议勾选，一些npm的包需要这些环境配置最后点击install完成安装配置nodejs相关配置简介：Node.j
·
1. 下载与安装
点击【Node.js中文网】根据自身系统进行下载长期支持的版本，然后直接按安装流程走即可
2. 安装环境配置
- node.js是一个基于Chrome V8引擎的JavaScript运行环境，让JavaScript 运行在服务端的开发平台
- npm是nodejs安装后自带的默认包管理器，用于管理依赖包的下载与卸载
# 检查版本
node -v
npm -v
若无法获取版本号，则在编辑环境变量为node的安装目录
3. npm包管理配置
- 项目配置
npm init：初始化项目，生成 package.json 文件。
npm init -y：快速初始化，跳过交互式问答，
- 查看npm的配置
npm config ls -l #查看npm的所有配置信息
npm config get globalconfig #获取全局配置文件的路径，默认不启用
npm config get userconfig #获取用户配置文件的路径，默认启用
npm config get registry #获取远程依赖包的下载地址
npm config get cache #获取包缓存路径
npm config get prefix #获取全局包的安装路径
npm config get proxy #获取代理地址
- 修改npm的配置
npm config list #获取用户配置
npm config set prefix="D:\Program Files\nodejs\node_global" #设置全局包的下载路径
npm config set cache="D:\Program Files\nodejs\node_cache" #设置缓存路径
npm config set registry=https://registry.npmmirror.com/ #设置远程镜像地址
npm config set proxy="http://127.0.0.1:[代理端口号]" #设置代理端口号
- 包下载、全局模块
首先我们要了解公共模块和私有模块，公共模块顾名思义是公共的一个模块，该模块下的包可以被其他所有项目所使用，而私有的模块下的包，只应用在当前项目下。
npm install <package> # 安装指定包到本地
npm install <package> --save-dev # 安装包并添加到 devDependencies
npm install <package> -g # 全局安装公共模块
npm uninstall <package> # 卸载当前私有模块
npm update <package> # 更新指定包到最新版本
- 新建一个空文件夹，在此文件夹下打开控制台，下载一个当前目录下的包，会产一个模块文件夹和两个配置文件
- 全局安装，在已配置的全局下载路径下观察结果
- 在下载完包后，此时执行包命令是无效的，因为包的环境路径还未被配置
- 为了让命令能在终端执行，我们需要在系统环境变量中添加该路径（D:\Program Files\nodejs\node_global）到系统环境Path中
- 完成以上操作后，即可在任意位置执行新安装的包命令
4. nodejs的基本使用
搭建简易后端服务器
- 新建项目的文件夹，分别包含HTML和server和文件夹如下，执行以下命令
cd .\server #进入server目录下
npm install express #在当前目录下安装express
- 测试代码
test.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>
<body>
<button id="btn">发送请求</button>
<div id="result" style="width: 200px; height: 500px;"></div>
<script>
var btn = document.getElementById('btn');
var div = document.getElementById('result');
btn.onclick = function (){
axios({
method:'GET',
url: 'http://localhost:8000/server/'
}).then(resp=>{
console.log(resp.data);
div.textContent = resp.data;
})
}
</script>
</body>
</html>
server.js
const express = require('express');
const server = express();
server.get('/server', (req, resp)=>{
// 设置跨域
resp.setHeader("Access-Control-Allow-Origin", "*");
// 发送消息
resp.send("你好!");
})
server.listen(8000, ()=>{
console.log("服务已经启动,监听8000端口中...");
})
- 启动服务器，在前端html页面中向服务端发送请求
node .\server.js #启动服务器
5. npm的基本使用
npm init # 初始化项目(生成package.json)
npm install (-g) #添加依赖
npm uninstall (-g) # 删除依赖
npm update (-g) # 更新依赖
npm run (dev，build，start,test) # 运行脚本
npm test # 测试模块
npm start # 启动模块
npm stop # 停止模块
npm restart # 重新启动模块
npm publish # 发布模块
搭建vue 2.0开发环境
- 安装包根据，安装完成后查看版本，检查是否安装成功
npm install webpack webpack-cli -g #全局安装webpack和webpack-cli
npm install vue vue-cli -g #全局安装vue-cli脚手架构建工具
- 初始化Vue项目
vue init webpack demo #初始化命令
cd demo #移动到项目下
npm run dev #启动项目
- 运行Vue项目，在终端中Ctrl+localhost:8080 可直接打开网站
openEuler 是由开放原子开源基金会孵化的全场景开源操作系统项目，面向数字基础设施四大核心场景（服务器、云计算、边缘计算、嵌入式），全面支持 ARM、x86、RISC-V、loongArch、PowerPC、SW-64 等多样性计算架构
更多推荐
6
0- 0
已为社区贡献1条内容
所有评论(0)