在微信小程序中，正确引用JS文件是保证代码模块化、提高开发效率的重要步骤。下面，我将详细讲解如何在微信小程序中引用JS文件，并附带一些实用的技巧和注意事项。
1. 创建JS文件
首先，你需要创建一个JS文件。这可以通过微信开发者工具中的“新建文件”功能实现。例如，你可以创建一个名为common.js的文件，用于存放一些通用的JavaScript代码。
// common.js
function sayHello() {
console.log('Hello, world!');
}
2. 在页面中引用JS文件
2.1 在页面的<script>标签中引入
在页面的<script>标签中，使用src属性引入JS文件。例如：
<script src="/utils/common.js"></script>
注意：这里的/utils/common.js表示该文件位于项目根目录下的utils文件夹中。
2.2 在页面中直接编写JS代码
如果你只是想在该页面中使用common.js中的sayHello函数，可以直接在页面的<script>标签中编写如下代码：
// 引入common.js中的sayHello函数
const { sayHello } = require('/utils/common.js');
// 调用sayHello函数
sayHello();
2.3 使用ES6模块导入
从微信小程序3.4.0版本开始，支持ES6模块导入。在页面的<script>标签中，使用import语句引入JS文件。例如：
import { sayHello } from '/utils/common.js';
// 调用sayHello函数
sayHello();
3. 注意事项
- 引入JS文件时，路径应从页面文件开始计算，而不是从项目根目录开始。
- 如果使用ES6模块导入，注意确保你的小程序版本支持该功能。
- 为了提高代码的可读性和可维护性，建议将不同功能的JS代码拆分成多个文件，并在页面中按需引入。
4. 总结
本文详细介绍了在微信小程序中引用JS文件的方法，包括创建JS文件、在页面中引入JS文件以及注意事项。希望这些内容能帮助你更好地掌握微信小程序的开发技巧。