用于 webpack 的 Knockout 组件加载器 koc-loader

码农软件 · 软件分类 · 常用JavaScript包 · 2019-04-04 21:28:42

软件介绍

koc-loader 是一个 webpack loader,可以使用类似 Vue 单文件组件的风格来编写和使用 Knockout 组件。

代码上基于 vue-loader、san-loader 进行编写,支持各种其他 loader 组件的搭配使用。

使用 yarn 或 npm 安装

yarn add koc-loader -D

webpack配置示例(这里使用了ts)

{
    resolve: {
        extensions: ['.ts', '.js', '.koc']
    },
    module: {
        rules: [
            {
                test: /\.ts$/,
                loader: 'ts-loader',
                exclude: /node_modules/,
                options: {
                    appendTsSuffixTo: [/\.koc$/]
                }
            },
            {
                test: /\.koc$/,
                loader: 'koc-loader'
            }
        ]
}

example.koc

<template>
    <div>
        <div data-bind="text: info"></div>
        <menu></menu>
    </div>
</template>

<script lang="ts">
import ko from 'knockout';
import Menu from "./src/component/menu/menu.koc"; //加载其他ko组件

ko.components.register('menu', Menu);

export default class viewModel {
  info: KnockoutObservable<string>;

  constructor(params: any) {
    this.info = ko.observable("hello koc-loader");
  }
}
</script>

更详细的使用信息,可以查看:https://my.oschina.net/zaaksam/blog/1574629

本文地址:https://www.codercto.com/soft/d/2873.html

超级连接者:破解新互联时代的成功密码

超级连接者:破解新互联时代的成功密码

伊桑•祖克曼(ETHAN ZUCKERMAN) / 林玮、张晨 / 浙江人民出版社 / 2018-8-1 / CNY 72.90

● 我们生活在一个互联互通的世界,我们需要辩证地看待某些事件,发现隐藏在背后的真相。着眼当下,看清彼此之间的联系,而非凭空幻想未来世界联系之紧密。数字世界主义要求我们承担起责任,让隐藏的联系变成现实。 ● 我们对世界的看法是局限的、不完整的、带有偏见的。如果我们想要改变从这个广阔的世界所获取的信息,我们需要做出结构性的改变。 ● 建立联系是一种新的力量。无论是在国家层面、企业层面还是个......一起来看看 《超级连接者:破解新互联时代的成功密码》 这本书的介绍吧!

XML、JSON 在线转换
XML、JSON 在线转换

在线XML、JSON转换工具

正则表达式在线测试
正则表达式在线测试

正则表达式在线测试