Можно ли разбить js файл на модули? [дубликат]

449

14 января 2017, 14:09

На данный вопрос уже ответили:

Подскажите модульную систему js 1 ответ

Всем привет. Пишу код который весьма громадный. Может я и что-то делаю не так, но пока все работает и меня устраивает)) Проблема в том, что чем больше код тем менее он понятен и читабелен. Я бы хотел его разделить на несколько .js файлов и подключать при помощи импорта. Возможно ли такое? Если да то прошу объяснить, как это делать. Работал только с js и jquery. Особых навыков JS не имею. Так что прошу по порядку всё изложить, если не сложно.

Answer 1

Добрый день! Для организации модульной структуры js, вы можете воспользоваться requireJs, тогда подключение модулей будет выглядеть примерно так:

define([
  "jquery"
], function($){
  // use jquery
}

Для более приятного import/export можно использовать возможности js стандарта es6. Тут вам не обойтись без какого-нибудь сборщика, который будет транслировать es6 в es5 стандарт. Например, можно использовать gulp, webpack, grunt или любой другой + babel, es6fy, browserfy и т.д., тогда код будет выглядеть еще приятней:

import {$} from "../vendor/jquery";

Answer 2

Если вы используете jQuery, то можно подключить файл, используя jQuery.getScript():

$.getScript("imported_script.js", function(){
   alert("Скрипт загружен!");
});

Answer 3

Добрый день. Обратите внимание на такие библиотеки, как requireJS. О подключении писали выше. Также, можно писать на TypeScript и использовать стандартные модули ES6 через его import и export. Изучите паттерны проектирования, такие как: модуль, наблюдатель, медиатор, фасад. Это поможет вам структурировать код и писать более грамотные веб-приложения