前端如何使用搭建项目脚手架?

53 阅读1分钟

node环境的安装

我们脚手架的安装是基于node环境的,所以我们呢要先安装好node环境。
考虑到不同的项目可能需要node的版本不同需要切换node版本,我们就采用nvm方式安装node环境。 windows版本nvm下载——nvm-windows (github.com)
mac版本nvm安装——nvm-mac
具体安装步骤自行搜索,安装nvm之后,再安装不同版本的node,这样就可以使用了。

vue项目脚手架搭建

 npm install -g @vue/cli
 vue create 文件名
 // 选择对应的版本就行,或者自定义想要的插件
 安装后,
 cd 文件名
 npm run serve启动

react脚手架搭建

npx create-react-app 文件名
cd 文件名
npm start启动

vite搭建vue项目

vite创建vue2项目 vite搭建vue2项目_vite vue2-CSDN博客

先使用yarn create vite或者npm init vite@latest创建一个项目
选择原生项目
进入项目cd vite-vue2
安装vue依赖yarn add vite-plugin-vue2 vue@2 vue-template-compiler
创建src目录,在里面创建App.vue文件和main.js文件
在根目录下创建vite.config.js文件
修改index.html里的main.js的路径
删除不要的文件
安装其他插件
创建其他文件夹和相关配置

vite创建vue3项目

先使用yarn create vite或者npm init vite@latest创建一个项目
然后选择vue3项目
进入项目cd vite-vue3
安装依赖yarn
删除不要的文件或代码
配置config文件和其他插件
npm run dev启动项目

vite搭建react项目

先使用yarn create vite或者npm init vite@latest创建一个项目 
然后选择react项目
进入项目cd 项目名称
初始化依赖
启动项目