为啥要安装前端库？ [关闭]

Posted 2023-02-22

【中文标题】为啥要安装前端库？ [关闭]

【英文标题】：Why should we install frontend libraries? [closed]为什么要安装前端库？ [关闭]

【发布时间】：2019-05-29 02:11:56

【问题描述】：

我正在使用 Vue.js 开发一个网页，没有后端（目前）。 我需要标签，所以已经查看了vue-tabs-component。

但是对于install，我需要：

npm install vue-tabs-component --save

如何将此库提供给用户？他们在导航时不会安装 npm 或 npm install vue vue-tabs-components。

我只开发前端，因此我不需要 npm，我从几台计算机开发 p，有几台没有 npm。

有没有办法只使用 <script src=...> 的库？

我以vue-tabs-component 为例，但我的问题很笼统：如果要在没有安装前端的情况下提供给客户，我为什么要安装前端？

【问题讨论】：

很多问题都归结为一个问题：“如何从第三方来源为图书馆提供服务”、“如何为用户提供图书馆”、“网络服务器如何工作”、“我需要前端开发教程”、“CDN 与资产直接服务”等。请缩小范围。

当您构建您的应用程序时，它将创建一个捆绑 js 文件，其中包含您所有的 javascript。所以你的用户不需要安装任何东西

官方教程在第二部分vuejs.org/v2/guide名为“Getting Started”

【参考方案1】：

“安装”这个词可能会给您带来一些困惑。 npm install some-front-end-library 下载我们想象中的 some-front-end-library 包（例如 vue 组件）的文件。

“安装”（下载包）后，您在 Vue 项目中引用这些文件。例如。

import somefrontendlibrary from 'some-front-end-library'

Vue.use(somefrontendlibrary);

您需要先在您正在开发的计算机上下载/安装该软件包，以便能够将它们导入您的项目中。就像您下载任何其他第三方脚本一样，您稍后会使用脚本标签添加这些脚本。

当您构建项目（npm run build）时，将生成一个 vendor.js 文件（以及其他文件），其中包括 some-front-end-library 包。此文件包含您已安装的包（并通过Vue.use() 添加）。

您的最终构建 (npm run build) 将有一个带有 <script src="vendor.js" /> 标记的 index.html 文件。

【讨论】：

很好的解释谢谢

是的，很好的解释，谢谢。一个“离题”的小问题：文档对import Tabs, Tab from 'vue-tabs-component'; 说，但它不起作用。 import Tabs, Tab from './nodes_modules/vue-tabs-component/dist/index.js'; 确实，这是做事的“正常方式”吗？

不，您不应该直接指向您的节点目录。您是否在 main.js 文件中导入？

我完全错过了我应该“构建”应用程序的部分，所以现在我正在使用 webpack，import Tabs, Tab from 'vue-tabs-component'; 在构建后运行良好。我绝对不知道这些前端“构建”。我曾经使用 jQuery :D

【参考方案2】：

您需要安装模块才能使用它。例如，如果您在 Web 应用程序的某处需要 vue-tabs-components，那么您将需要该模块的源代码才能使用选项卡。

当它提供给客户端时，代码会被打包和捆绑，所以这是真的，它们不需要 npm，但你作为开发人员需要这样做。

无论您是否是前端，如果您使用的是 Javascript，那么在开发过程中的某一时刻，您很有可能不需要 NPM。

如果您想使用 CDN，可以查看https://cdnjs.com/

有一些 NPM 前端库的 CDN，但并不总是保证你会找到你要找的东西。