koc-loader用于 webpack 的 Knockout 组件加载器
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
评论