首页 > 其他分享 >vant-weapp 提供的areaList城市数据的路径问题

vant-weapp 提供的areaList城市数据的路径问题

时间:2024-04-01 23:29:34浏览次数:26  
标签:文件 vant index weapp js esm city areaList

根据vant 官网提供的引入方法会报错。

通过add @vant/area-data会下载一份index.esm.mjs文件城市数据在项目中,我尝试了用各种路径来获取还是报错,最后只能将该index.esm.mjs文件复制到其他文件中,然后引入就可以了。

 1.新建一个文件夹专门放数据的,然后在建个文件用来放这个数据。我建的文件名是city.js

然后把index.esm.mjs文件的所有内容拷贝到city.js中,后面直接在需要的地方引入这个city.js文件就行。

引入

  

成功显示

        

标签:文件,vant,index,weapp,js,esm,city,areaList
From: https://blog.csdn.net/furygdk/article/details/137242791

相关文章

  • VUE基于 vant 的移动端 REM 适配
    当我们添加完vant组件库后,还需要对项目的移动端进行适配执行 yarnaddamfe-flexible 安装 amfe-flexible安装完成后我们在main.js 中配置 动态设置rem基准值然后通过执行 yarnaddpostcss-pxtorem-D 把  postcss-pxtorem 安装到开发环境中在项目根目录中......
  • 微信小程序(vantWeapp) UI组件库
     vantWeapp官方文档: https://youzan.github.io/vant-weapp/#/quickstart 根据文档的安装步骤  为什么写这样的变量名就能实现对相关的组件修改自定义颜色呢? 原因如下:根据文档描述,官方提供了相关的变量对应的组件 https://github.com/youzan/vant-weapp/blo......
  • vue3+ts+vant写移动端项目部Android机页面打开空白
    前言部分安卓机因为内置webview较老,所以无法识别最新的es6的语法,页面打开空白。解决方式,vite项目就使用@vitejs/plugin-legacy,其他项目可以选择使用@babel/core@babel/cli@babel/preset-env这里主要提vite项目,因为babel项目的相关博客较多,就不再复述。 vite.config......
  • Vite 2.0 + Vue3 + Ts + Vant3移动端项目
    highlight:androidstudioVite2.0搭建Vue3移动端项目一.涉及技术点vitevue3tsroutervuexaxiosvant3移动端适配请求代理二.步骤vite+ts+vue3只需要一行命令npminit@vitejs/appmy-vue-app--templatevue-ts初始化项目npminstallnpmrundev**......
  • 解决uniapp项目中使用vant Weapp图标组件报错问题(Module build failed from ./node_mo
    解决uniapp项目中使用vantWeapp图标组件报错问题(Modulebuildfailedfrom./node_modules/postcss-loader/src/index):https://blog.csdn.net/it_cgq/article/details/111991644?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522170909210216800225582870%2522%252C%252......
  • trao项目怎么跨端安装vant组件库
    一、安装依赖npminstallvant二、添加web标签适配插件在config/index.js文件constconfig={//...plugins:[["@tarojs/plugin-html",{//过滤vant组件库的前缀:van-pxtransformBlackList:[/van-/],},]......
  • Vue3+Vant+Vite H5移动端开发(二)
    vue3项目创建使用vue创建项目命令npmcreatevue@latest基础配置配置IP和localhost打开项目,修改'package.json'文件下的‘scripts’配置--host0.0.0.0显示ip地址可以打开项目--open启动项目,在浏览器中自动打开"scripts":{"dev":"vite--host0.0.0.0......
  • vue3+ts使用插件vue3-esign完成签字、重签(h5、vant)
    1.安装vue3-esign:npmivue3-esign2.main.ts中引入:importVue3Esignfrom'vue3-esign'app.use(Vue3Esign)3.页面中代码:<van-nav-bartitle="手写签字"left-arrowfixed/><divid="sign_box"><divclass="text&......
  • "@vant/weapp/dist/col/index" 未找到----路径错误
    错误提示如图: 官方文档是这样引入的: 但是我看了一下npm库的目录:可以发现引入目录名字都不一样我们手动改即可 再运行就不报错了 ......
  • 微信小程序中使用Vant Weapp组件库
    【快速上手-VantWeapp(gitee.io)】【node版本对应的npm版本表-菜小鱼~-博客园(cnblogs.com)】【报错npmERR!Acompletelogofthisruncanbefoundin:npmERR!-CSDN博客】【解决:npminstall报错‘Theoperationwasrejectedbyyouroperatingsystem‘-C......