小编Ron*_*Ron的帖子

如何要求未与webpack一起打包为UMD兼容模块(AMD,CommonJS)的JavaScript库？

我不希望库通过加载器.我只是希望它在需要时包含在<script>标记中,并且webpack可以管理这种依赖.

我不想简单地将它放在我的脚本标签中index.html,因为我想利用webpack的代码分割,并且只在必要时包含它.

我读过'外部',我不确定这与它有什么关系.文档不够清楚.

谢谢 :)

更新的问题

此问题还特别针对前端库,只需通过<script>标签即可实现.

我正在尝试使用 SVG 元素创建响应式 SVG 剪辑路径<path>。但是，我无法使其正常工作。

我已经使用更基本的形状（例如 ）让它工作<circle>，但不是<path>元素。我还让它使用元素的静态尺寸来工作<path>。

我使用此处的说明作为参考：https://www.smashingmagazine.com/2015/05/creating-responsive-shapes-with-clip-path/。我还在 StackOverflow 和其他示例上查看了类似的问题，但它们主要处理基本形状而不是路径变量。

我使用的 SVG 形状是从 Adob​​e Illustrator 导出的雨滴形状。

这是我的代码：

超文本标记语言

<svg id="raindropSVG" viewBox="0 0 810 1012">
    <defs>
        <clipPath id="raindropClipPath" clipPathUnits="objectBoundingBox">
            <path d="M0,604.4C0,523.7,30.7,408.8,97.5,320,217,160.9,409.2,0,409.2,0S597.2,167.8,717,331c63,85.7,93,196.4,93,274,0,224.5-181.3,407-405,407S0,829.5,0,604.4Z"/>
        </clipPath>
    </defs>
</svg>

<img src="clipped-image.jpg" alt="" class="clipped-img">

CSS

.clipped-img {
    clip-path: url(#raindropClipPath);
    width: 100%;
    height: auto;
}

#raindropSVG {
    width: 0;
    height: 0;
}

这个想法是，改变宽度（或高度）.clipped-img应该相应地缩放雨滴形状。

使用clipPathUnits="objectBoundingBox"对于做出clipPath响应是必要的。然而，一旦我添加这个，剪切的图像就会消失。

我认为我哪里做错了

我怀疑路径元素指定的路径不是相对单位，但我不知道如何将单位更改为相对单位。

预先感谢所有回复！