Vue2和Vue3的创建项目、vue-cli2和3的步骤及区别

原创已于 2023-01-30 17:01:34 修改 · 368 阅读

CC 4.0 BY-SA版权

文章标签：

于 2023-01-30 15:44:51 首次发布

21 篇文章

订阅专栏

本文详细介绍了使用Vue2和Vue3构建项目的步骤。包括安装对应的Vue CLI版本、初始化项目、运行开发服务器及打包部署等内容。适用于希望快速上手Vue应用开发的技术人员。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

vue2

安装vue-cli2版本步骤
1.下载vue-cli2

npm i -g vue-cli

2.vue-cli2构建vue项目

// vue2是项目名，可以自己定义
vue init webpack vue2

3.进入项目目录并运行

// 1.vue2 是文件夹，需要与上面项目名相同
cd vue2
// 2.npm run dev 或者 npm start
npm start

4.打包并运行

//1.打包
npm run build
//生成dist文件

1.下载vue-cli3

npm i -g @vue/cli

2.vue-cli3构建vue项目

//如果你需要用旧版本（vuecli<3）的vue init功能，可以全局安装一个桥接工具：
cnpm i -g @vue/cli-init
// vue3是项目名，可以自己定义
vue create vue3

3.进入项目目录并运行

// 1.vue3 是文件夹，需要与上面项目名相同
cd vue3
// 与脚手架2运行命令不一样
npm run serve

4.打包并运行

//1.打包
npm run build
//生成dist文件夹

打开vue的ui项目管理器