如何使用vue3搭建项目框架并运行IT

1、打开在电脑上新建的文件夹kmw，然后鼠标右键，选择GitBashHere

打开Git命令窗口

2、使用npm命令安装vue/cli，这里需要使用--force；由于之前安装了vue2下的vuecli，需要覆盖之前的

npminstall-g

vue/cli--force

npminstall-g

vue/cli--force

3、使用npminit初始化项目，命令为：

npminitvite-appkmw

npminitvite-appkmw

4、切换到项目根目录，使用cdkmw命令

切换到项目根目录，cdkmw

5、使用npminstall安装项目依赖包以及模块

npminstall

6、接着使用npmrundev命令，启动和运行项目

npmrundev命令，启动和运行项目

7、将创建的项目导入HBuilderX工具，查看项目文件以及结构

将创建的项目导入HBuilderX工具

8、打开package.json文件，可以查看到vue版本是3.0

打开package.json文件，查看vue版本

9、打开浏览器，在地址栏输入访问地址，可以查看到界面效果

预览项目界面效果

vue3和vue2创建项目区别

vue3

npminstall-g

vue/cli--force：安装vueclinpminitvite-appkmw：初始化项目cdkmw：切换项目路径npminstall：安装项目依赖包npmrundev：启动和运行项目vue2

npminstall--globalvue-cli：安装vueclivueinitwebpackkmw：初始化基于webpack模板项目cdkmw：切换项目路径npminstall：安装项目依赖包npmrundev：启动和运行项目

转载请注明：http://www.0431gb208.com/sjszjzl/2175.html