Давайте посмотрим на первую структуру файлов и как мы ее используем.
Примечание. В этом решении используется веб-пакет для компиляции всех файлов и создания одного универсального файла для приложения.
- У нас есть один каталог, который включает 4 файла.
- Файл main-index.js будет иметь ссылку на модульные файлы.
Файл a содержит функцию a() и вызывает функцию b() и c() соответственно.
В конце экспортируйте функцию a() с помощью module.exports, чтобы функция a() была доступна другим файлы.
Точно так же файл b имеет только одну функцию b(), которая печатает console.log().
В файле c есть одна функция c(), которая вызывает другую функцию b().
Давайте посмотрим объяснение каждого утверждения и цели.
В Node есть два важных и основных модуля для управления зависимостями, и мы собираемся использовать оба.
На следующем снимке экрана первое утверждение — это синтаксис, а второе — фактическое использование. Итак, здесь fileC.js импортируется с использованием require.
Теперь в файле C.js мы объявляем функцию c() и экспортируем ее.
Так что же такое module.exports? Всякий раз, когда вы хотите экспортировать какой-либо объект, функцию или классы на корневой уровень, вам поможет module.exports. :)
Теперь webpack скомпилирует все файлы и сгенерирует один файл. В этом файле будет весь код из четырех файлов, и он будет выглядеть так.
В своем HTML укажите ссылку на этот файл, и все готово.
Пошаговое выполнение здесь.
- Первая функция main() будет выполняться из индексного файла.
2. Затем внутри файла main-index будет прочитана требуемая ссылка.
3. Затем он перейдет к файлу A и прочитает требуемую ссылку для файла C.
4. Теперь он придет к файлу C и прочитает требуемую ссылку для файла B.
5. Теперь все ссылки собраны, поэтому он придет и выполнит вызов функции.
6. После шага 5 все ссылки собираются из соответствующего файла и готовы к использованию. Как и в шаге 5, переменная callFunction содержит функцию a(). Таким образом, хотя функция a() часть для fileA готова использовать количество раз в этом файле через переменную callFunction.
7. Он последовательно выполнит функции и выведет консоль. окончательный вывод будет выглядеть так.
Это оно! Действительно легко. :)
Сообщите мне отзыв об этой статье. Если вам нравится и вы считаете, что это полезно, пожалуйста, поделитесь или поаплодируйте этой статье. Также дайте мне знать, если вы хотите, чтобы я добавил дополнительные сведения в эту статью.