【米尔瑞萨RZ/G2L开发板-创新应用】2、vite + vue 环境搭建

vite + vue 环境搭建



按说明书里的方法接好串口线，网线然后开机。进入系统后，就开始部署vite + vue的开发环境了。


一、安装nvm

NVM简介
Node Version Manager（NVM）是一个用于管理Node.js版本的工具，它允许开发者在同一台计算机上安装和切换不同版本的Node.js。在开发过程中，不同的项目可能需要不同版本的Node.js来运行，使用NVM可以方便地切换不同版本，而不会影响其他项目的运行。

NVM的主要功能包括：

• 安装和卸载Node.js版本：NVM可以从官方Node.js源或其他第三方源下载和安装各种版本的Node.js。开发者可以根据项目需要安装特定版本，也可以随时卸载不需要的版本。
• 切换Node.js版本：通过简单的命令，开发者可以在不同项目之间轻松切换Node.js版本。这样，每个项目都可以使用其所需的特定版本，而不会影响其他项目的运行。
• 管理全局和本地Node.js版本：NVM允许开发者同时管理全局和本地的Node.js版本。全局版本是整个计算机系统共享的版本，而本地版本只适用于当前项目。
• 管理全局和本地NPM包：NVM还可以帮助管理全局和本地的NPM包。开发者可以安装和管理全局NPM包，也可以在每个项目中使用本地NPM包。
  

NVM的使用极大地简化了多个Node.js项目之间的管理，避免了版本冲突和环境配置的问题。它为开发者提供了更好的灵活性和便利性，使得在不同项目中选择合适的Node.js版本变得更加轻松和高效。因此，NVM成为了Node.js开发者的必备工具之一。

==========================================================

使用国内源安装NVM

由于nvm源码默认是托管在github上，然后npm源也是常规源，安装慢。

但是在下载安装脚本的时候，发现了一个大问题。。。。

就是EMMC系统里没有git包，也没有gcc，更没有包管理系统。用常规的方式安装部署nodejs环境是有问题的。

所以只能采用另一种办法，从已经安装好nvm环境的系统里打包.nvm目录，并传输过来解压。

使用以下命令拷贝另一块开发板上打包好的nvm环境。

1. scp cat@192.168.50.239:~/nvm.tar.gz -r ~/

复制代码

然后解压出来

1. tar zxf nvm.tar.gz

复制代码

然后在.bashrc里添加以下配置内容

1. # nvm config                                                               
   
2. export NVM_DIR="$HOME/.nvm"                                    
   
3. [ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm
   
4. export NVM_NODEJS_ORG_MIRROR=https://npm.taobao.org/mirrors/node

复制代码

退出终端后，就可以运行node和npm命令了。

二、安装vite和pm2包

安装TypeScript和pm2、vite，在命令行输入以下命令。

1. npm install typescript pm2 vite -g

复制代码

安装完毕后，运行pm2查看结果，正常情况下，如下图

运行pm2 list结果如下图

接下来使用以下命令创建vite项目

1. npm create vite@latest my-app -- --template vue-ts

复制代码

然后按照提示的命令，进入my-app目录，并安装依赖包，然后用vite --host启动服务就可以了

添加--host参数后，服务就暴露到网络上了。

这时候在局域网的电脑上打开链接，就可以看到下面截图的内容啦。就可以开始开发vue应用了。

总结：在米尔瑞萨RZ/G2L开发板上是可以部署vue开发环境的。只是性能方面，这个板子用来开发，会比较慢，可以的话，还是在主机上开发好，再打包放到板子上部署http服务比较好。