如何为 CDN 服务器上的 vanilla JavaScript 前端开发和生产构建捆绑 npm 包？
How to bundle npm packages for vanilla JavaScript frontend development and production builds on CDN servers?
我有一个使用 ES6 模块的普通 HTML/CSS/JavaScript 站点 (repository)。它可以成功部署到 GitHub 个页面和 Netlify。
在我的 HTML 中，我这样导入 main.js：
<script src="js/main.js" type="module" defer></script>
在我的 main.js 文件中，我像这样导入我制作的其他模块：
import * as data from './data.js';
import displayUserCard from './displayUserCard.js';
现在 我还想安装和导入 npm 模块 以在我的网站上使用，就像我在我的网站上使用我自己的代码一样.
我是这样安装lodash的：
npm i lodash
然后在我的 main.js 文件中，我像这样导入 lodash，就像我在我的 Node 应用程序中所做的那样：
import _ from 'lodash';
这当然行不通，并且会出现以下错误，因为我们现在是在浏览器中，而不是在 Node 应用程序中：
^Uncaught TypeError: Failed to resolve module specifier "lodash". Relative references must start with either "/", "./", or "../".^
研究这个，我明白这样的开发环境需要一个网络打包器，但我发现了从过时的工具（如 Browserify 和 RequireJS）到过于复杂的工具（如 WebPack）到较新的打包器（如 Parcel、Vite）的所有东西和 Snowpack，它们似乎都没有解决为开发和生产构建轻松捆绑 npm 包的问题。
在 2021/2022 年，在 vanilla HTML/CSS/JavaScript 前端应用程序中使用 lodash 等节点模块的最直接方法是什么，以便它们可以在 CDN 上捆绑、构建和部署喜欢 GitHub 页、Netlify 和 Vercel?
您需要做的是安装一个 javascript 捆绑器，它将所有需要的模块（例如 lodash）转换并存储在您的浏览器可访问的位置。
观看this video，开门见山，总结一切。
我有一个使用 ES6 模块的普通 HTML/CSS/JavaScript 站点 (repository)。它可以成功部署到 GitHub 个页面和 Netlify。
在我的 HTML 中，我这样导入 main.js：
<script src="js/main.js" type="module" defer></script>
在我的 main.js 文件中，我像这样导入我制作的其他模块：
import * as data from './data.js';
import displayUserCard from './displayUserCard.js';
现在 我还想安装和导入 npm 模块 以在我的网站上使用，就像我在我的网站上使用我自己的代码一样.
我是这样安装lodash的：
npm i lodash
然后在我的 main.js 文件中，我像这样导入 lodash，就像我在我的 Node 应用程序中所做的那样：
import _ from 'lodash';
这当然行不通，并且会出现以下错误，因为我们现在是在浏览器中，而不是在 Node 应用程序中：
^Uncaught TypeError: Failed to resolve module specifier "lodash". Relative references must start with either "/", "./", or "../".^
研究这个，我明白这样的开发环境需要一个网络打包器，但我发现了从过时的工具（如 Browserify 和 RequireJS）到过于复杂的工具（如 WebPack）到较新的打包器（如 Parcel、Vite）的所有东西和 Snowpack，它们似乎都没有解决为开发和生产构建轻松捆绑 npm 包的问题。
在 2021/2022 年，在 vanilla HTML/CSS/JavaScript 前端应用程序中使用 lodash 等节点模块的最直接方法是什么，以便它们可以在 CDN 上捆绑、构建和部署喜欢 GitHub 页、Netlify 和 Vercel?
您需要做的是安装一个 javascript 捆绑器，它将所有需要的模块（例如 lodash）转换并存储在您的浏览器可访问的位置。
观看this video，开门见山，总结一切。