我正在使用旧版 jquery/bootstrap web 应用程序,我正在将其转换为 node.js/webpack 项目。 我能够让其中大部分工作正常运行,但只有一个元素是所见即所得文本编辑器。
原来项目使用this editor ,但它不再维护,而且我无论如何也无法从 github 将其安装到 npm install 。这时我开始在 google-fu 上寻找替代品,并发现 this .
它需要全局命名空间中的 Handlebars 和范围,但这并不是结束。 到目前为止,无论我尝试什么,我都无法克服错误:
vendor.bundle.js:13993 Uncaught TypeError: Cannot read property 'fn' of undefined
有问题的行是:
$.fn.wysihtml5
这是我不明白的,既然 jquery 位于全局命名空间中,为什么它是“未定义”?
var App = function() {
var uiInit = function() {
$('.textarea-editor').wysihtml5();
};
return {
init: function() {
uiInit();
}
};
}();
$(function(){ App.init(); });
package.json:
{
"name": "wysihtml-problem",
"version": "1.0.0",
"description": "",
"main": "app.js",
"scripts": {
"start": "webpack-dev-server"
},
"author": "fbielejec",
"license": "LGPL",
"dependencies": {
"jquery": "^2.2.0",
"handlebars": "^4.0.5",
"rangy": "^1.3.0",
"bootstrap3-wysihtml5-commonjs": "0.0.4"
},
"devDependencies": {
"html-webpack-plugin": "^2.7.1",
"webpack": "^1.12.11",
"webpack-dev-server": "^1.14.1"
}
}
webpack.config.js:
var webpack = require('webpack');
var HtmlWebpackPlugin = require('html-webpack-plugin')
module.exports = {
entry: {
app: "./app.js",
vendor: ["jquery", "rangy", "wysihtml5"],
},
output: {
path: __dirname + '/dist',
filename: "bundle.js"
},
resolve: {
alias: {
handlebars: 'handlebars/dist/handlebars.min.js',
rangy: "rangy/lib/rangy-core.js",
wysihtml5: "bootstrap3-wysihtml5-commonjs",
}
},
plugins: [
new HtmlWebpackPlugin({
title: "wysihtml-webpack"
}),
new webpack.optimize.CommonsChunkPlugin(chunkName = "vendor", filename = "vendor.bundle.js"),
new webpack.ProvidePlugin({
$: "jquery",
jQuery: "jquery",
'window.jQuery': "jquery",
rangy: "rangy",
})
]
};
最佳答案
看起来 jQuery 会尝试内省(introspection)环境,并且如果它发现环境有一个模块系统(并且它从 Webpack 中找到了一个),则不会污染全局命名空间。
使用此代码获取对 jQuery 对象的引用:
var $ = require('jquery')
您还可以在窗口
上手动分配$
:
window.$ = require('jQuery')
但更倾向于使用第一个选项,因为它会产生更易于维护的代码并允许进一步优化(例如,webpack 的模块使用 jQuery 并相应地将包拆分为多个 block )。
关于javascript - 将所见即所得文本编辑器 jquery 插件与 webpack 捆绑在一起,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38944134/