(一)基于vue3的openlayers项目创建

创建基于vue3的openlayers项目

1.cmd配置Vue3环境,启动项目,安装ol库(前提是你配置好vue3的环境,网上有很多教程,大家可以自行寻找)
(1)进入cmd的两种方法。一种是直接在指定的目录地址栏中输入cmd敲回车即可;第二种可以里面“Windows+r”键打开运行对话框,在框中输入cmd敲回车,然后再输入相应的命令。
(2)选择好你的目录后,配置Vue3环境,输入命令npm init vue@latest,会提示输入项目名称例如输入vue-olapp,下面依次输入否否否,按回车就行,初学者就是这样。
在这里插入图片描述
(3)执行以上命令,得到一个初始化基于Vue3的项目,注意一定要执行以上命令
在这里插入图片描述
按住Ctrl点local地址,得到如下:

在这里插入图片描述
(4)vscode打开你创建的项目,安装ol库,即可创建基于Vue3的openlayers项目文件,在电脑上按Ctrl+、~这个键运行终端
在这里插入图片描述
安装ol库,输入命令npm install ol,如下显示安装成功:
在这里插入图片描述
(5)删除掉一些没有必要的文件,红色框框都可以删除,App.vue里面也删除,写三个最简单的结构语句就行,
在这里插入图片描述
在这里插入图片描述
以及把main.js里面的.css样式去掉:
在这里插入图片描述

基于vue3的openlayers项目文件就创建好了,接下来就可以写一个基本的基于vue3的openlayers地图显示,下一篇文章继续分享。

  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值