uniapp 代码编译到小红书小程序（手把手保姆级教程）

目前uniapp并不支持直接编译到小红书小程序，那么如果使用uniapp开发好的小程序代码怎么运行到小红书呢？

第一步：安装node下载地址，安装vue脚手架；

第二步：安装vue脚手架，打开终端输入命令；

npm install -g @vue/cli@4

第三步：创建项目，继续终端输入命令；

vue create -p dcloudio/uni-preset-vue uni-app-xhs

此处需要注意以下两点：

1.创建项目选择 hello uni-app 项目模板；

2.项目中的 manifest.json，如果其中的 vueVersion 写了 3，会报错，需要改成 2；

第四步：终端先 cd 到你第三步创建项目（uni-app-xhs）的目录下；

cd uni-app-xhs

第五步：终端输入命令；

npm run dev:mp-xhs

第六步：打开小红书开发工具 ；

              点击导入，当你第五步终端运行成功后，你的项目包根目录下会出现一个 dist 的文件夹，然后点击 dist ➡️ dev ➡️ mp-xhs。导入到开发工具中；

此时你的项目应该就已经正常运行起来了，你会看到的是 uniapp 的组件模板页面，到此处说明就已经创建并运行成功了；

第七步：在文件夹中找到 src 文件，然后进入

选择 src 文件夹中的所有文件，删除；

然后找到你已经开发好的 uniapp 项目代码，选择根目录下的所有代码，粘贴复制进入上一步的 src 文件夹里边，然后你小红书开发工具中的页面就是你刚复制进去的已经开发好的 uniapp 项目了。

注：如果复制进去并没有变化，那么就退出终端和小红书开发工具，终端重新 cd 到你的项目目录，然后运行 npm run dev:mp-xhs ，重新导入一下项目即可。

运行过来的代码样式或者组件有的可能会不兼容，需要整体测试修复一下，大多数是没有问题的。