背景
我正在尝试创建一个“无构建”JavaScript 应用程序,每次保存任何源文件时,我都不需要watch
运行任务来转换 JSX、重新捆绑代码等。
它只适用于第一方代码,但是当我尝试import
从 npm 依赖依赖时我被卡住了。
目标
我想实现这种工作流程:
npm install foo
(假设它是一个 ES 模块,而不是 CommonJS)- 编辑
source/index.js
和添加import { bar } from 'foo'
npm run build
. 某些东西(webpack、rollup、自定义脚本等)运行,并将foo
其捆绑到其中./build/vendor.js
(没有来自 的任何东西source/
)。- 编辑
index.html
以添加<script src="build/vendor.js" type="module"...
- 我可以
source/index.js
在我的浏览器中重新加载,并且bar
将可用。npm run build
直到下次添加/删除依赖项时,我才需要运行。
我已经让 webpack 将依赖项拆分到一个单独的文件中,但是要import
在无构建上下文中从该文件中分离出来,我必须import { bar } from './build/vendor.js
. 那时 webpack 将不再 bundle bar
,因为它不是相对导入。
我也尝试过Snowpack,它在概念上更接近我想要的,但我仍然无法配置它来实现上述工作流程。
我可以编写一个简单的脚本来将文件从 复制node_modules
到build/
,但我想使用捆绑软件来进行摇树等操作。不过,很难找到支持这种工作流程的东西。