nodejs安装及Vue工程部署

nodejs备忘

  • npm是什么东东?npm其实是Node.js的包管理工具(package manager),类似java的maven
  • npm install=npm i。在git clone项目的时候,项目文件中并没有 node_modules文件夹,项目的依赖文件可能很大。直接执行,npm会根据package.json配置文件中的依赖配置下载安装。

windows安装nodejs

  1. node下载地址:http://nodejs.cn/download/

推荐使用node14版本,按正常的顺序下来,python这次可以安装成功。

  1. 安装过程中要求下载python
  1. 查看是否成功:进入cmd命令,执行:
node -v
npm -v
  1. 对工程进行启动,使用的vscode,进入Terminal,执行:
npm install
npm run dev

如果npm刚安装,需要重启vscode。

linux(Centos)环境安装nodejs和工程部署

一、nodejs安装

  1. 进入root用户环境
  2. 下载nodejs安装包,推荐14版本,这个版本安装可以成功,部署工程错误很顺利解决,其他版本安装报错没有

链接:https://nodejs.org/download/release/v14.19.0/

  1. 下载:
 wget https://nodejs.org/download/release/v14.19.0/node-v14.19.0-linux-x64.tar.gz
  1. 解压并放入指定目录
tar -xzvf node-v14.19.0-linux-x64.tar.gz
mv node-v14.19.0-linux-x64 /usr/local/node14
  1. 建立软连接
ln -s /usr/local/node14/bin/node /usr/bin/node
ln -s /usr/local/node14/bin/npm /usr/bin/npm
  1. 查看版本
$ node -v
$ npm -v
  1. 安装vue
sudo npm install vue -g
  1. 修改镜像地址为淘宝的镜像地址:
npm config set registry http://registry.npm.taobao.org/

如果需要改回来可以执行下面的命令:

npm config set registry https://registry.npmjs.org/

二、vue工程部署启动

  1. 进入vue工程
  2. 执行编译
sudo npm install --production --unsafe-perm=true --allow-root --registry=https://registry.npm.taobao.org

–unsafe-perm=true可以解决非root账号执行的权限问题
3. 启动:

sudo npm run dev
  1. 正式环境发布:
sudo nohup npm run build:prod &

三、遇到问题及解决:

1、node-sass错误:
 Error: `sass-loader` requires `node-sass` >=4. Please install a compatible version.

报错原因为:加载器要求版本大于等于4,但是版本node-sass 并不兼容 node v8 的版本。所以我们需要升级node的版本,执行命令::

 sudo npm i node-sass -D

发现会报下面权限的问题:

gyp ERR! stack Error: EACCES: permission denied, mkdir '/home/site/ma/node_modules/node-sass/.node-gyp'

实际原因是由于用的是root账户权限执行npm,而npm默认是不适用root权限创建内容,因此会出现权限问题而导致失败,加上参数–unsafe-perm=true --allow-root即可解决问题。执行下面命令,解决问题

 sudo npm i node-sass -D  --unsafe-perm=true --allow-root
2、vue-cli-service: command not found错误:
vue-cli-service: command not found

原因是vue-cli未安装,解决方式:执行下面代码:

 sudo npm install vue-cli --unsafe-perm=true --allow-root
3、cross-env错误:
sh: cross-env: command not found

解决方式:

sudo npm i --save-dev cross-env --unsafe-perm=true --allow-root
4、github上拉取代码错误

github上拉去代码执行 npm install报错 code:128

解决方案:安装ssh key,参考:https://blog.csdn.net/qq_38230265/article/details/79108862?utm_source=app&app_version=4.5.8

5、windows下找不到npm命令的错误
npm : 无法将“npm”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。请检查名称的拼写,如果包括路径,请确保路径正确,然后再试一次。
所在位置 行:1 字符: 1
+ npm install typescript --save -dev
+ ~~~
+ CategoryInfo : ObjectNotFound: (npm:String) [], CommandNotFoundException
+ FullyQualifiedErrorId : CommandNotFoundException

如果是刚刚安装的nodejs,重启下vscode就行

6、Cannot find module ‘webpack’ 问题解决办法

解决办法:

npm install --save-dev webpack --unsafe-perm=true --allow-root

参考:https://www.cnblogs.com/xxflz/p/9835344.html

7、问题:Error: Rule can only have one resource source (provided resource and test + include + exclude)

原因分析:package.json中webpack版本冲突问题。
解决方法:删除webpack,重新装以前的版本。

npm uninstall webpack
npm install webpack@^4.0.0 --save-dev

参考:https://blog.csdn.net/weixin_40643648/article/details/109444867

参考文档

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值