Excel自定义函数加载项：解决‘Cannot use import statement outside a module’报错及外部JavaScript函数正确使用指南

首先得给你划个重点：Excel自定义函数和Taskpane是运行在完全隔离的JavaScript环境中的，你直接从taskpane.js导入函数到functions.js的做法本质上不符合Office加载项的架构设计——这也是你看到"Cannot use import statement outside a module"错误的核心原因。虽然调试时偶然输出了结果，但这种跨环境的引用是不可靠的，必须调整写法。

下面逐个解答你的疑问：

1. 如何消除"Cannot use import statement outside a module"错误？ #

首先立刻停止直接跨taskpane.js和functions.js导入函数的操作，然后按以下步骤修正：

• 将需要复用的函数（比如你的testExternal）提取到独立的通用模块中，避免依赖特定环境的代码。
• 确保webpack配置正确处理模块打包：Yeoman生成的模板默认已经配置好了双入口（taskpane和functions），只要你的通用模块被这两个入口文件引用，webpack会自动将代码分别打包到对应的bundle中，不会出现模块加载错误。
• 检查functions.html中的script标签，确认引用的是webpack打包后的dist/functions.js，而非源文件src/functions/functions.js——模板默认会处理这个，但如果手动修改过路径要修正回来。

2. 调用非taskpane.js中定义的外部JavaScript函数的正确步骤 #

正确的做法是创建共享的通用工具模块，让taskpane和自定义函数各自独立引入使用：

1. 创建通用模块文件：在src目录下新建utils文件夹，里面创建utils.js，把需要共享的函数放在这里：

   // src/utils/utils.js
   export function testExternal() {
     return 1;
   }
   

2. 在自定义函数中导入使用：修改src/functions/functions.js：

   import { testExternal } from "../utils/utils.js";
   
   // 自定义函数示例
   function MY_TEST_FUNCTION() {
     console.log(testExternal());
     return testExternal();
   }
   CustomFunctions.associate("MYTESTFUNCTION", MY_TEST_FUNCTION);
   

3. 在taskpane中导入使用（如果需要）：修改src/taskpane/taskpane.js：

   import { testExternal } from "../utils/utils.js";
   
   // 在taskpane逻辑中使用
   console.log(testExternal());
   

4. 重新构建项目：运行npm run build，webpack会自动把通用模块的代码分别打包到dist/taskpane.js和dist/functions.js中，两个环境就能独立使用这些工具函数了。

关于utils.js的存放位置和自动构建到dist的问题 #

• 最佳存放位置：就放在src/utils/目录下，这样能清晰区分通用工具代码和特定功能代码（taskpane、自定义函数），项目结构更整洁。
• 自动打包到dist：Yeoman生成的项目默认用webpack管理构建，只要你的utils.js被taskpane.js或functions.js导入，webpack会自动分析依赖，把工具函数的代码打包到对应的bundle文件中，不需要手动复制到dist目录。如果有静态资源（比如配置文件）需要单独复制，可以添加copy-webpack-plugin来配置，但JavaScript模块webpack会自动处理。

内容的提问来源于stack exchange，提问作者user2285985