创建vuejs3项目详细步骤

我参考的是菜鸟教程+百度:

https://www.runoob.com/vue3/vue3-install.html

前提:自己要安装好了nodejs 设置npm cnpm等

 

然后开始正文:

1,先安装vue-cli脚手架:

# 全局安装 vue-cli
$ cnpm install -g @vue/cli
# 安装完后查看版本
$ vue --version
@vue/cli 4.5.11

2,安装桥接工具(一定要安装这个)

如果不安装安装桥接工具的话。会报错:

Command vue init requires a global addon to be installed.
Please run yarn global add @vue/cli-init and try again.

创建vuejs3项目详细步骤

安装方法:

cnpm i -g @vue/cli-init

创建vuejs3项目详细步骤

3,用vue cli脚手架搭建项目:

命令:vue init webpack 项目名

这里需要进行一些配置,默认回车即可
vue init webpack runoob-vue3-test

创建vuejs3项目详细步骤

4,进入项目,安装并运行:

$ cd runoob-vue3-test
$ cnpm run dev
  DONE  Compiled successfully in 2558ms          

 I  Your application is running here: http://localhost:8080

创建vuejs3项目详细步骤

 

安装成功!

创建vuejs3项目详细步骤

上一篇:win7、nodejs版本 13.14.0、安装开发vue所有需要的组件,并顺带解决'vue-cli-service' 不是内部或外部命令 的问题


下一篇:mac环境下安装node,更换npm为淘宝源并命名为cnpm,安装vue-cli并更换为4.x版本,并使用vue ui 图形化页面创建使用vue项目