Hbuilder如何创建并运行Vue项目

在Hbuilder中开发Vue项目是非常快捷的，下面小编给大家分享一下如何在Hbuilder中创建并运行Vue项目。方法/步骤1.首先打开Hbuilder创建一个新项目，如下图所示2.Hbuilder如何创建并运行Vue项目接着模板选择Vue项目，如下图所示3.Hbuilder如何创建并运行Vue项目然后等待一会项目就创建好了，如下图所示4.Hbuilder如何创建并运行Vue项目接着右键单击选择

zyu67

7606人浏览 · 2021-08-22 13:31:27

zyu67 · 2021-08-22 13:31:27 发布

在Hbuilder中开发Vue项目是非常快捷的，下面小编给大家分享一下如何在Hbuilder中创建并运行Vue项目。

方法/步骤
1.首先打开Hbuilder创建一个新项目，如下图所示
在这里插入图片描述
2.Hbuilder如何创建并运行Vue项目
接着模板选择Vue项目，如下图所示

3.Hbuilder如何创建并运行Vue项目
然后等待一会项目就创建好了，如下图所示

4.Hbuilder如何创建并运行Vue项目
接着右键单击选择npm run build，如下图所示
在这里插入图片描述
5.Hbuilder如何创建并运行Vue项目
然后继续右键单击选择npm run serve，如下图所示

6.Hbuilder如何创建并运行Vue项目
接着找底部出现的地址和端口号，如下图所示

7.Hbuilder如何创建并运行Vue项目
最后在浏览器中输入即可访问vue页面了，如下图所示
在这里插入图片描述

总结

1，打开Hbuilder创建一个新项目

2，模板选择Vue项目

3，等待一会项目就创建好了

4，右键单击选择npm run build

5，继续右键单击选择npm run serve

6，找底部出现的地址和端口号

7，在浏览器中输入即可访问vue页面了

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^