时间戳

首页 > 解决方案 > PWA app.js 如何将代码移动到许多较小的文件中

node.js - PWA app.js 如何将代码移动到许多较小的文件中

问题描述

我写过 PWA 应用程序，应用程序不大，但现在我的 app.js 有 800 行代码。它有很多方法。如何将这些方法移动到按主题划分的另一个文件中？ require不工作

标签： node.jsprogressive-web-apps

解决方案

根据您支持的浏览器，您有几个选项。

您也许可以使用对模块的本机支持。您可以在https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules中找到有关此的更多信息这将是更简单的解决方案之一，因为它不需要任何额外的工具，但在此当时chrome外面的支持不是很好。

第二种选择是将代码分解为多个 JS 文件，然后分别加载它们。这可能会影响性能，但如果您的文件很小且很少，则不会导致太多问题。只需确保在这些文件中生成的代码将自己放在名称对象上以避免冲突。

前文件

(function() {

    window.mycode = {};
    window.mycode.func = function() {...};
})();

第三种选择是在浏览器中使用现有的模块加载器，例如https://requirejs.org/

第四个选项可能是最常见的，它是将构建步骤集成到使用 npm 和模块加载器（如 webpack 或 browserify）的代码中。这也让您可以集成在大型 javascript 项目中非常常见的 babel。缺点是它为您的部署添加了一个需要运行的步骤，并且您需要学习如何使用 webpack 之类的工具（这非常复杂）。但是，如果您从事 javascript dev 开发，您最终需要熟悉它们。

推荐阅读