title: Hbuilder项目转vue-cli项目 date: 2023-02-22 10:26:33 category: - 工作 - 技能提升 cover: https://www.yuucn.com/wp-content/uploads/2023/02/1677184306-68f663351001bd8.jpg tags: - uniapp description: Hbuilder项目转vue-cli项目步骤记录

Hbuilder 项目转 vue-cli 项目步骤记录

全局安装vue-cli

npm install -g @vue/cli

创建一个空的uni-app工程

vue create -p dcloudio/uni-preset-vue my-project

创建工程后选择默认模板

安装nvm

可以参考菜鸟教程的步骤    
    
    
  ，[点击跳转](使用 nvm 管理不同版本的 node 与 npm | 菜鸟教程 (runoob.com))

安装14版本的node并切换

nvm install 14.1 nvm use 14.1.0

安装sass

注意在新建的模板目录中运行安装

npm install node-sass@4.14.1 --save npm install sass-loader@8.0.0 --save

替换文件

删除新建工程目录中的src里所有内容

把Hbuilder新建的项目所有文件复制到src中  


     


     


     
，node_modules也需要

正常使用

npm run serve

其他

此文参考[凌晨肆点的洛杉矶](Uni-app工程转vue-cli工程步骤 - 凌晨肆点的洛杉矶 - 博客园 (cnblogs.com)) 的文章结合本人实际操作而来


 




 




 




，感谢大佬的付出    
    
    
  。其余步骤如修改css预处理器可参考原文操作  


     


     


     
。