我正在将 vue-cli 与 webpack 和 Laravel 结合使用。 在我的 app.blade.php 中从 cdn 加载 jQuery 文件(如 jQuery)可以正常工作,但我不想包含来自 cdn 的文件...
使用
require('@/js/assets/jquery.js');
在 app.js 中不起作用。当在我的浏览器中查看编译后的 app.js 时,似乎导入了 jQUery,但出现错误“$ 未定义”。
这对于我尝试在 vue 应用程序中添加的每个 js/css 文件都是相同的。
app.blade.php:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="csrf-token" content="{{csrf_token()}}">
<title>MTM</title>
<link href=" {{ asset('css/app.css') }}" rel="stylesheet">
</head>
<body>
<div id="app">
<app></app>
</div>
<script src="{{ asset('js/app.js') }}"></script>
</body>
</html>
webpack.mix.js:
const mix = require('laravel-mix');
mix.webpackConfig({
resolve:{
extensions:['.js','.vue'],
alias:{
'@': __dirname + '/resources'
}
}
})
mix.js('resources/js/app.js', 'public/js')
.sass('resources/sass/app.scss', 'public/css');
app.js
require('@/css/Semantic-UI-CSS-master/semantic.css');
require('@/js/assets/jQuery.js');
require('@/js/assets/semantic.js');
require('@/js/assets/tablesort.js');
最佳答案
您只需导入模块本身,但如果您想在 app.js 模块中将 jQuery 与 $
一起使用,则需要将 jQuery 分配给一个变量。
例如。在你的 app.js 中:
var $ = require('@/js/assets/jQuery.js');
如果你想全局使用 jQuery,你必须将它分配给一个全局变量,如下所示:
window.$ = window.jQuery = require('@/js/assets/jQuery.js');
请参阅 npm package documentation有关使用的更多信息。
关于laravel - 使用 vueJS laravel 包含 JS 库,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54628359/