dagger.js是一个基于html的开源（MIT）web前端技术框架-BFW插件库

dagger.js是一个基于html的开源（MIT）web前端技术框架

dagger.js是一个基于html的开源（MIT）web前端技术框架。

在dagger.js的帮助下，您无须依赖任何第三方工具或代码就可以轻松完成网站（无论是单页应用还是普通动态网站）前端页面的开发工作。

使用方式：

第一步引入dagger

如何过是cdn方式

<script type="module" crossorigin="anonymous" src="//repo.bfw.wiki/bfwrepo/js/dagger.release.js" defer></script>

如果是npm方式

npm install @peakman/dagger.js

第二步准备dom

 <div id="dagger" dg-cloak +loading="createMessage()">
        <button +click="processor(`Hello ${ message }!`)">Hello ${ message }!</button>
    </div>

第三步配置编写js脚本

 <script type="dagger/configs">
        { "anonymous_script": "#script" }
    </script>
    <script id="script" type="dagger/script">


        export const createMessage = () =>({ message: 'dagger' }); export const processor = content => alert(content);

    </script>

完整示例代码：

<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <style>
        button {
          width: 140px;
          height: 60px;
          font-size: 16px;
          margin-bottom: 100px;
        }
    </style>


</head>

<body>

    <script type="module" crossorigin="anonymous" src="//repo.bfw.wiki/bfwrepo/js/dagger.release.js" defer></script>


    <script type="dagger/configs">
        { "anonymous_script": "#script" }
    </script>
    <script id="script" type="dagger/script">


        export const createMessage = () =>({ message: 'dagger' }); export const processor = content => alert(content);

    </script>
    <div id="native">
        <script>
            const createMessage = () => 'Hello World!';
        </script>
        <button onclick="alert(createMessage())">Hello World!</button>
    </div>

    <div id="dagger" dg-cloak +loading="createMessage()">
        <button +click="processor(`Hello ${ message }!`)">Hello ${ message }!</button>
    </div>
    <div dg-cloak +loading="{ message: 'Hello dagger!' }">
        <button +click="alert($scope.message)">${ $scope.message }</button>
    </div>



</body>

</html>

文档教程：https://daggerjs.org/