用于 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

Rework

Rework

Jason Fried、David Heinemeier Hansson / Crown Business / 2010-3-9 / USD 22.00

"Jason Fried and David Hansson follow their own advice in REWORK, laying bare the surprising philosophies at the core of 37signals' success and inspiring us to put them into practice. There's no jarg......一起来看看 《Rework》 这本书的介绍吧!

CSS 压缩/解压工具
CSS 压缩/解压工具

在线压缩/解压 CSS 代码

HTML 编码/解码
HTML 编码/解码

HTML 编码/解码

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

正则表达式在线测试