在开发扫码小程序中,遇到胡坑“require() 默认不支持绝对路径”及其解决方案

在开发扫码小程序中,遇到胡坑"​​require() 默认不支持绝对路径"及其解决方案。

在微信小程序中,​require()默认不支持绝对路径​ ​(如/utils/store.js@/utils/store.js),只能使用相对路径(如../../utils/store.js)。

使用 resolveAlias 配置项用来自定义模块路径的映射规则。

配置了之后,会对 require 里的模块路径进行规则匹配并映射成配置的路径。

如果命中多条映射规则,则取最长的命中规则。

perl 复制代码
{
  "resolveAlias": {
    "~/*": "/*",
    "~/origin/*": "origin/*",
    "@utils/*": "utils/*",
    "subBUtils/*": "subpackageB/utils/*"
  }
}

注意

1、resolveAlias 进行的是路径匹配,其中的 key 和 value 须以 /* 结尾。

配置了上述路径映射规则,会做如下匹配并转换

  • ~/mod.js -> mod.js
  • ~/origin/mod.js -> origin/mod.js
  • @utils/mod.js -> utils/mod.js
  • subBUtils/mod.js -> subpackageB/utils/mod.js

2、如果在 project.config.json 中指定了 miniprogramRoot,则 /* 指代的根目录是 miniprogramRoot 对应的路径,而不是开发者工具项目的根目录。

然后使用别名引用:

ini 复制代码
const store = require('@utils/store.js'); // 等效于绝对路径

注意​ ​:此功能需要基础库版本 ​​2.12.0+​ ​,且仅支持require,不支持import

相关推荐
郝YH是人间理想38 分钟前
系统架构设计师案例分析题——web篇
前端·软件工程
Evaporator Core40 分钟前
深入探索:Core Web Vitals 进阶优化与新兴指标
前端·windows
初遇你时动了情1 小时前
html js 原生实现web组件、web公共组件、template模版插槽
前端·javascript·html
QQ2740287561 小时前
Soundness Gitpod 部署教程
linux·运维·服务器·前端·chrome·web3
前端小崔2 小时前
从零开始学习three.js(18):一文详解three.js中的着色器Shader
前端·javascript·学习·3d·webgl·数据可视化·着色器
哎呦你好2 小时前
HTML 表格与div深度解析区别及常见误区
前端·html
运维@小兵2 小时前
vue配置子路由,实现点击左侧菜单,内容区域显示不同的内容
前端·javascript·vue.js
koiy.cc2 小时前
记录:echarts实现tooltip的某个数据常显和恢复
前端·echarts
一只专注api接口开发的技术猿3 小时前
企业级电商数据对接:1688 商品详情 API 接口开发与优化实践
大数据·前端·爬虫
GISer_Jing3 小时前
[前端高频]数组转树、数组扁平化、深拷贝、JSON.stringify&JSON.parse等手撕
前端·javascript·json