我正在尝试在使用webpack加载它们之后让$和jQuery在DOM中工作。 我将需要jQuery来进行一些额外的dom操作,我将与video.js一起使用。
我已经阅读了webpack文档和this但是虽然我可以让jquery在bundle文件中工作没有任何问题,但我似乎无法让它在它之外工作。
我的文件处于当前状态:
webpack.config.js
var path = require('path');
var webpack = require('webpack');
module.exports = {
entry: './js/index.js',
output: {
filename: 'bundle.js',
path: path.resolve(__dirname, 'dist')
},
plugins : [
new webpack.ProvidePlugin({$: 'jquery',jQuery: 'jquery'})
],
};
的index.html
<!DOCTYPE html>
<html>
<head>
<title>Webpack test</title>
</head>
<body>
<div id="playerContainer"> </div>
<script type="text/javascript" src="./dist/bundle.js"></script>
</body>
</html>
index.js
jQuery("body").css("background","red");
$("body").css("background","blue");
的package.json
{
"name": "webpack-test",
"version": "1.0.0",
"description": "",
"main": "index.js",
"dependencies": {
"jquery": "^3.2.1"
},
"devDependencies": {
"webpack-dev-server": "^2.4.5",
"webpack": "^2.6.1"
},
"scripts": {
"start": "webpack -w",
"server": "webpack-dev-server"
},
"keywords": [],
"author": "",
"license": "ISC"
}
是否有可能让jQuery(以及其他库)在浏览器中运行?