通过<script src = ...> import

如何解决通过<script src = ...> import

我是JavaScript的新手，我试图为我在Python中创建的网站的某些部分添加一些现代的交互性。 Vue看起来很吸引我，我想不使用不熟悉的node / webpack等来使用它，

Vue网站对如何通过<script src=... >导入框架本身使用框架进行了非常全面的描述，但是我也想使用Vue2leaflet软件包。

我尝试使用<script src=... >将其添加到网页，然后使用

在脚本中注册组件

Vue.component('l-map',Vue2Leaflet.LMap);
Vue.component('l-tile-layer',Vue2Leaflet.LTileLayer);
Vue.component("l-circle",Vue2leaflet.LCircle)

我能够使用图块图层来渲染openStreetMaps，但是无法将l圆渲染到地图上。
代码如下：https://jsfiddle.net/b2c1rzfa/14/

为什么没有画出圆圈（对于任一尝试的选项）？所述的Vue2leaflet组件的导入和注册方法是否正确？

解决方法

我在Vue论坛上收到了一个答案，将其粘贴到这里是为了别人的利益（感谢短裙）-如下所述进行修改后，一切正常：

注册组件的方式没有问题。

主要问题是此行： <l-tile-layer :url="ll.url"/>
您需要将其更改为： <l-tile-layer :url="ll.url"></l-tile-layer>
因为您使用的是 In-DOM模板，在Vue获得之前，浏览器会将其解析为HTML 靠近它的任何地方。浏览器的解析器不支持自动关闭使用尾随/>标记。结果是跟随在将被视为孩子而不是兄弟姐妹。

修复后，您将收到一些验证错误，因为您的第二个圆缺少其属性上的一些：前缀。

然后您将收到一个错误消息，因为您尚未注册l-popup，但是如果您将其缩小，将会看到您的圈子。