# JS Files
New > JS File menu.
In the same menu, there are also a couple more options:
- JSON File - Create a JSON file (opens new window) for storing data. These files can be edited in the app just like normal JS files, but are used for the purpose of holding static data.
- JS Module - Add a MJS file to your project. This is a file type that is mostly interchangeable with regular JS files but is specifically used when writing JS modules (opens new window).
- Folder - Create a folder for organizing your assets. Folders can be nested inside each other.
Ctrl + Click method, or check whether right clicking is enabled in your computer's settings.
# Importing JS Files
Import JS File.
You can create/import as many files as you wish, and organize them into folders to make them easier to manage.
- When importing js files, you make a copy of them in your project. Any changes made in the original file will not be displayed in your project. If this is not what you want, you can link JS files instead.
- Keep in mind that jQuery (if enabled) and the Bootstrap JS files are imported in Bootstrap Studio automatically, there is no need to included them again.
# JS File Order
Here you can reorder the files as you need them and then click the Save button. These changes will be applied to all pages in your design.
The Bootstrap framework's JS file is always included first in the page, before any other code.
When right clicking a JS file, selecting the
Visibility option will open a dialog where you can control its visibility on the different pages of your design.
# Editing JS
When you click the Apply button (or hit
Ctrl/Cmd + S) the Preview is automatically reloaded so you can try out your changes immediately (see our tutorial about Preview and Export for more).
# Editor Settings
The built-in editor offers color highlighting, multiple selections, search & replace () with regex support, and other helpful features.
There are also a number of customization option that are accessible from the editor context menu.
These settings allow you to adjust the font size, switch between tabs or spaces, and open the JS file in an External Editor.
# Linking External JS
Link External JS.
In the dialog you can paste a URL to an externally hosted JS file and it will be added to your design. Externally linked resources are not stored as files in your project, instead they're included in
<script> tags before the page's closing
Bootstrap Studio caches external JS files for some time. If you want to get the latest version of the linked file, you need to right click it, and choose the