jquery项目 html使用export import方式调用模块

ops/2024/9/19 0:44:24/ 标签: jquery, vue.js, 前端

jquery的老项目，引入vue3, 需要方便使用export, import方式引用一些常用的方法与常量

导出模块 export

js/numberUtil.js

/*** @Description:* @Author Lani* @date 2024/1/10*//*
* 【金额】    保留2位小数，不四舍五入
* 5.992550 =>5.99 , 2 => 2.00
* 67.49 乘以100之后：6748.9999
*
* */
export function toFixed2Decimal(value) {return (parseFloat(value * 100) / 100).toFixed(2)
}

其他js调用

还用import

js/orderUtil.js

/*** @Description:* @Author Lani* @date 2024/5/6*/import {toFixed2Decimal} from "./numberUtil.js";export const getOrderAmount = (value = 1.698) => {let temp = toFixed2Decimal(value)console.log('|--最终结果：temp=', temp)return temp
}

html网页调用

重点在script这个标签的配置

使用type="module", 在script内部再使用import

.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><script src="js/jquery-1.9.1.js"></script>
</head>
<body>
<ul id="ul001"><li>TEST 01</li>
</ul>
<script type="module">import {getOrderAmount} from "./js/orderUtil.js";$(function () {getOrderAmount()})
</script>
</body>
</html>