- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在使用 Knockout-Validation 插件创建 Knockout Web 应用程序。我想使用 WebPack 进行捆绑。
问题是当我使用 WebPack 时,Knockout-Validation 会中断。
作为一个简单的测试用例,我无需捆绑即可使验证正常工作:https://jsfiddle.net/3y24zvLs/
HTML:
<label>Name</label>
<input type="text" data-bind="value: name">
<pre data-bind="text: ko.toJSON($data, null, 2)"></pre>
JS:
function ViewModel() {
var self = this;
self.name = ko.observable().extend({required: true});
};
ko.applyBindings(new ViewModel());
我还可以将它用作注册的 Knockout 组件:http://jsfiddle.net/3y24zvLs/2/
HTML:
<name-component></name-component>
JS:
function ViewModel() {
var self = this;
self.name = ko.observable().extend({required: true});
};
ko.components.register('name-component', {
viewModel: ViewModel,
template: '<label>Name</label>\
<input type="text" data-bind="value: name">\
<pre data-bind="text: ko.toJSON($data, null, 2)"></pre>'
});
ko.applyBindings();
但是,当我尝试使用捆绑验证时会中断:
index.html:
<!DOCTYPE html>
<head>
<script src="Built/main.bundle.js"></script>
</head>
<body>
<name-component></name-component>
</body>
main.js
var ko = require('../node_modules/knockout/build/output/knockout-latest');
var $ = require('jquery');
require('./ViewModel');
$(function(){
ko.applyBindings();
})
ViewModel.js
"use strict";
var ko = require('../node_modules/knockout/build/output/knockout-latest');
var kv = require('../node_modules/knockout.validation/dist/knockout.validation');
function ViewModel() {
var self = this;
self.name = ko.observable().extend({required: true});
};
ko.components.register('name-component', {
viewModel: ViewModel,
template: '<label>Name</label>\
<input type="text" data-bind="value: name">\
<pre data-bind="text: ko.toJSON($data, null, 2)"></pre>'
});
webpack.config.js
var webpack = require('webpack'),
path = require('path');
module.exports = {
context: path.join(__dirname, 'App'),
entry: './main.js',
output: {
path: path.join(__dirname, 'Built'),
filename: '[name].bundle.js'
},
module: {
loaders: [
{ test: /\.html$/, loader: 'html-loader'},
{ test: /\.js$/, loader: 'babel-loader'}
]
}
};
有谁知道验证失败的原因吗? Knockout-Validation 与 WebPack 配合得不好吗?也许我应该尝试改用 Gulp 或 Grunt 来捆绑组件并使用 RequireJS 而不是 WebPack/CommonJS?虽然我不完全确定这个开关有多简单......
非常感谢任何帮助。
最佳答案
我想删除这个问题,因为我刚刚解决了它,但是今天早上我浪费了一些时间试图让它发挥作用,所以如果我把它留在这里,希望能防止其他人浪费时间。
我将 jQuery、Knockout 和 Knockout-Validation 移至全局范围,并删除了一些重新定义问题。
index.html
<!DOCTYPE html>
<head>
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.0/knockout-debug.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout-validation/2.0.3/knockout.validation.js"></script>
<script src="Built/main.bundle.js"></script>
</head>
<body>
<name-component></name-component>
</body>
main.js
/*
Knockout and jQuery were moved to the global scope. Knockout exports as
'ko' so there is no need to redefine it here.
*/
//var ko = require('../node_modules/knockout/build/output/knockout-latest');
//var $ = require('jquery');
require('./ViewModel');
$(function(){
ko.applyBindings();
})
为了完整起见,这里是其他文件:
ViewModel.js
"use strict";
function ViewModel() {
var self = this;
self.name = ko.observable().extend({required: true});
};
ko.components.register('name-component', {
viewModel: ViewModel,
template: '<label>Name</label>\
<input type="text" data-bind="value: name">\
<pre data-bind="text: ko.toJSON($data, null, 2)"></pre>'
});
webpack.config.js
var webpack = require('webpack'),
path = require('path');
module.exports = {
context: path.join(__dirname, 'App'),
entry: './main.js',
output: {
path: path.join(__dirname, 'Built'),
filename: '[name].bundle.js'
},
module: {
loaders: [
{ test: /\.html$/, loader: 'html-loader'},
{ test: /\.js$/, loader: 'babel-loader'}
]
}
};
关于javascript - 与 WebPack 捆绑时 knockout 验证中断,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34002558/
#include int main() { int i; for( i = 0; i< 10 ; i++ ) { printf("test1 &d", i);
我有一个连接到远程服务器以查询数据的 C# 程序。数据很大,所以查询大约需要 2 分钟才能完成。在这 2 分钟的时间内,互联网中断了。这导致作业无法完成,程序卡在获取数据例程中。 它建立了连接,但在选
语句 1: [2,4,6,7,8].each do |i| (i % 2 == 0) || (puts "Not even" && break) puts i end 声明 2: [2
我想知道 C++ 是否有任何处理中断的方法。我希望一个程序将信息存储在文本文件中,而另一个程序根据文本文件中的内容打印一条语句。由于我希望它尽可能准确,因此我需要在更新程序更新文件时中断打印程序。 最
我正在尝试终止一个线程,但它不会中断或停止。所有这些都是名为 Webots 的软件 Controller 的一部分。我用它来模拟多机器人系统。在每个机器人的 Controller 中,我启动了一个线程
中断10h可以使用的服务有很多, 我想问一下关于其中两个我很困惑的问题 首先是, AH = 06H SCROLL UP WINDOW AH = 07H SCROLL DOWN WINDOW 在 D
我有一个基本的 SQL 问题,如果有两个事件连接,"A"和 "B"到 SQL 服务器,假设两者之间发生死锁,那么为了避免死锁,SQL 服务器将回滚其中一个连接“A”或“B”的交易。假设 SQL Ser
我有一个 mapkit/ View ,它工作正常 - 但我滚动并在 2 - 10 次移动后我的应用程序崩溃了......而且这只是一个“中断”。 这是我的代码的一部分。我认为这是后台线程和数组释放/覆
有什么办法可以做到,比如 C/C# ? 例如(C#风格) for (int i = 0; i Seq.tryFind (fun i -> printfn "%d" i i=66) 在实践中,
我的问题是Haskell如何与系统交互。 例如,IO如何发生? 我对IO monad不感兴趣。或者如何使Haskell打印字符串或读取文件。 我对Haskell和底层操作系统之间的层(如果是这样的话)
你能确认下一个break是否取消了内部for循环吗? for (out in 1:n_old){ id_velho <- old_table_df$id[out] for
我有一个程序可以进行一些数据分析,并且有几百行长。 在程序的早期,我想做一些质量控制,如果没有足够的数据,我希望程序终止并返回到 R 控制台。否则,我希望执行其余代码。 我尝试过break、brows
我有一个 if 语句,用于检查我的对象(向导)是否命中了项目。如果他这样做了,巫师的大小将会改变,他应该能够在与障碍物的 1 次碰撞中幸存。 现在我陷入了“在 1 个障碍物碰撞中幸存”,因为在我的碰撞
我正在尝试使用迭代器来显示很多内容。我不断收到“break;”错误线。它说这是一个无法访问的声明。如有任何帮助,我们将不胜感激。 public Lot getLot(int number) {
我正在创建一个应用程序,我需要在其中处理可能非常庞大且可能需要一些时间的数据。 现在我阅读了很多关于 IntentService 的资料,实际上我已经将它实现为处理 REST 调用的通信类,但现在我试
我有一个自定义的 UITableViewCell。该单元具有三个标签。最左边的“金额”标签具有以下约束。 在单元格的右侧,我有另一个标签,“Label Dollar Amount”。它具有以下约束:
我有以下不和谐嵌入: message.reply({ content: '', embed: { color: 11416728, author
JavaScript 不是我最擅长的技能,但我会尽力解释,所以就这样吧。我有人在我的网站上创建了一个幻灯片菜单,我也使用 jplayer 音乐播放器。 现在一切正常,直到我在顶部添加此脚本。由于某种原
我已经在 Ubuntu 上安装了 android studio,有一个带有损坏图像的 API,我也尝试过重新安装。我应该怎么做才能克服这个问题。 删除它后,它没有在 sdk 管理器中显示 提前致谢。
假设我的站点上有大约 10 个 css 文件。我想把它们合二为一。但是当我组合它们时(只是“连接”文件,以便将它们包含到 html 中),我的样式/布局中断了。这不是路径问题或其他问题,只是选择器无法
我是一名优秀的程序员,十分优秀!