Imagine having a file structured like this:
// HelperFunctions.ts
export const dateFormat = 'MM/DD/YYYY';
export const isEmpty = (input: string | null | undefined): boolean => {
if (input == null) {
return true;
}
if (!input) {
return true;
}
return input.trim().length <= 0;
};
export const formatDateTime = (dateTime: Date): string => {
return moment(dateTime).format(dateFormat);
};
When using these functions in a React Native component, you can import them like this:
import * as Helpers from "../../utils/HelperFunctions";
And then call the functions like so:
if (Helpers.isEmpty(inputText)) ...Alternatively, you can also import individual methods:
import {isEmpty} from "../../utils/HelperFunctions";
And use them with: if (isEmpty(inputText)) ....
Personally, I find the first method more descriptive because it shows the "class" containing the methods, making it clearer for me when invoking them.
The issue I face is that I always need to define the whole HelperFunctions file and its methods just to be able to use import * as Helpers, which can be tedious. Unlike with objects like:
// Themes.ts
export default {
primaryTheme: '#ff0000',
secondaryTheme: '#00ff00',
}
...where intellisense can automatically suggest the import statement:
import Themes from "../../styles/Themes";Is there a way to structure the HelperFunctions file in a manner that eliminates the need for manually writing the import section, allowing intellisense to auto-import the methods?