Adobe Illustrator JSX脚本中如何从外部文件导入函数？

Great question! Adobe's ExtendScript (the stripped-down JavaScript used in apps like Photoshop, After Effects, Illustrator, etc.) doesn't support standard ES6 import or CommonJS require syntax, but there's a straightforward built-in solution using the $.evalFile() method. Here's how to set it up properly:

Step 1: Structure Your Utility File (utils.js) #

First, write your helper functions in utils.js—you can structure them either as top-level functions or wrap them in an object to avoid global variable pollution.

Option A: Top-Level Functions (Simple) #

// utils.js
function formatText(text) {
  return text.trim().toUpperCase();
}

function calculateDuration(startTimestamp, endTimestamp) {
  return endTimestamp - startTimestamp;
}

Option B: Object-Wrapped Functions (Cleaner, Less Conflict) #

If you want to avoid cluttering the global scope, wrap your utilities in an object:

// utils.js
var ScriptUtils = {
  formatText: function(text) {
    return text.trim().toUpperCase();
  },
  calculateDuration: function(startTimestamp, endTimestamp) {
    return endTimestamp - startTimestamp;
  }
};

Step 2: Import and Use Utilities in main.js #

Use $.evalFile() to load utils.js into your main script. The key here is handling file paths correctly to avoid "file not found" errors.

Handle Relative Paths Safely #

Instead of hardcoding absolute paths (which break if you move your script folder), use the current script's location to build the path to utils.js:

// main.js
// Get the folder where the current script (main.js) is located
var currentScriptFolder = File($.fileName).parent;
// Build the full path to utils.js
var utilsFilePath = currentScriptFolder + "/utils.js";

// Attempt to load the utility file
var utilsLoaded = $.evalFile(utilsFilePath);

// Optional: Add error handling if the file fails to load
if (!utilsLoaded) {
  alert("Error: Could not load utils.js. Check the file path!");
  exit(); // Stop the script if utilities are critical
}

// Now use the functions!
// If you used Option A (top-level functions):
var processedText = formatText("  hello adobe extendscript  ");
alert(processedText); // Shows "HELLO ADOBE EXTENDSCRIPT"

var sessionDuration = calculateDuration(1000, 3500);
alert(`Session lasted ${sessionDuration}ms`); // Shows "Session lasted 2500ms"

// If you used Option B (object-wrapped):
var processedText2 = ScriptUtils.formatText("  hello modular code  ");
alert(processedText2); // Shows "HELLO MODULAR CODE"

Key Notes to Remember #

• $.evalFile() executes the external file's code directly in the current script's context—so any functions/variables in utils.js become available just like they were written in main.js.
• Always test path handling: If your script is run from a different context (e.g., via Adobe's Scripts panel vs. double-clicking), using File($.fileName).parent ensures the path stays valid.
• Avoid naming conflicts: If you use top-level functions, make sure their names don't clash with functions/variables in main.js or other imported files. The object-wrapped approach is better for larger projects.

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