0

我正在尝试对我的一些 html 页面进行组件化,以使它们成为 ractive 组件并使用 ractive-load 加载它们。我不使用任何构建系统或“工具”(即 grunt、browserify、require 等)

我收到错误消息:

You can only have one <script> tag per component file

索引.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>My Title</title>

    <!-- Javascript -->
    <script src="static/jquery-2.1.4/jquery-2.1.4.min.js"></script> 
    <script src='static/ractive-0.7.3/ractive.js'></script> 
    <script src='static/ractiveload/ractive-load.js' ></script> -->
    <script src='static/app.js' ></script> 

  </head>

  <body>

        <header>
                <a href='/'>My Title</a>
        </header> 

        <!-- This is a dynamic div that is loaded on-demand by ractive. -->
        <div class='wrapper' id='mainPanel'>
        </div>

  </body>
</html>

应用程序.js:

$(document).ready(function(){

    Ractive.load('views/control.html').then( function(Control){
        var ractive = new Control({
            el: "#mainPanel",
        });
    }).

意见/控制.html:

<script type='text/javascript' src="static/some/lib.js"></script>
<script type='text/javascript' src="static/some/otherlib.js"></script>


<div>This is a test</div>

如何将其他 JavaScript 库加载到 Ractive 组件中?

4

1 回答 1

0

使用单文件组件时,您使用特殊require功能。请注意,此功能不以任何方式与任何工具的实现相关联。然而,它可能是底层工具实现的抽象。

但是组件规范提到require的行为取决于正在使用的加载器。在 ractive-load 的情况下,它的依赖管理不是很复杂。它的行为是如果在前面没有找到,则在Ractive.load.modules或全局中查找依赖项。window这只能意味着您的依赖项必须在您的应用程序加载之前存在于这两个位置中的任何一个。在从 加载的情况下window,将您的依赖项添加为常规<script>标记应该可以工作。

如果您正在寻找一种更高级的组件文件依赖管理形式而不需要 cli 工具,您可以查看在RequireJS 之上运行的rvc 。

于 2017-03-11T02:28:11.487 回答