laravel 如何在laravel项目中添加jquery
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/32498328/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
how to add jquery in laravel project
提问by Misterk
I am new to laravel framework. I want to use jQuery in web application built using laravel framework.
我是 Laravel 框架的新手。我想在使用 Laravel 框架构建的 Web 应用程序中使用 jQuery。
But don't know how to link to jQuery libraryin laravel project.
但是不知道如何在laravel 项目中链接到jQuery 库。
采纳答案by iCoders
you can use online library
你可以使用在线图书馆
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
or else download library and add css in css folder and jquery in js folder.both folder you keep in laravel public folder then you can link like below
或者下载库并在 css 文件夹中添加 css，在 js 文件夹中添加 jquery。两个文件夹都保存在 Laravel 公共文件夹中，然后你可以像下面这样链接
<link rel="stylesheet" href="{{asset('css/bootstrap-theme.min.css')}}">
<script src="{{asset('js/jquery.min.js')}}"></script>
or else
要不然
{{ HTML::style('css/style.css') }}
{{ HTML::script('js/functions.js') }}
回答by ahaurat
For those using npm to install packages, you can install jquery via npm install jqueryand then use elixir to compile jquery and your other npm packages into one file (e.g. vendor.js). Here's a sample gulpfile.js
对于那些使用 npm 安装包的人，您可以通过安装 jquery npm install jquery，然后使用 elixir 将 jquery 和您的其他 npm 包编译成一个文件（例如 vendor.js）。这是一个示例 gulpfile.js
var elixir = require('laravel-elixir');
elixir(function(mix) {
mix
.scripts([
'jquery/dist/jquery.min.js',
// list your other npm packages here
],
'public/js/vendor.js', // 2nd param is the output file
'node_modules') // 3rd param is saying "look in /node_modules/ for these scripts"
.scripts([
'scripts.js' // your custom js file located in default location: /resources/assets/js/
], 'public/js/app.js') // looks in default location since there's no 3rd param
.version([ // optionally append versioning string to filename
'js/vendor.js', // compiled files will be in /public/build/js/
'js/app.js'
]);
});
回答by jogarcia
To add jquery to laravel you first have to add the Scaffolded javascript file, app.js
要将 jquery 添加到 Laravel，您首先必须添加 Scaffolded javascript 文件 app.js
This can easily be done adding this tag.
添加此标签可以轻松完成。
<script src="{{ asset('js/app.js') }}"></script>
There are two main procesess depending on the version but at the endof both you will have to execute:
根据版本的不同，有两个主要过程，但在这两个过程结束时，您都必须执行：
npm run dev
That adds all the dependencies to the app.js file. But if you want this process to be done automatically for you, you can also run:
这会将所有依赖项添加到 app.js 文件中。但是，如果您希望为您自动完成此过程，您还可以运行：
npm run watch
Wich will keep watching for changes and add them.
Wich 将继续观察变化并添加它们。
Version 5.*
版本 5.*
jQuery is already included in this version of laravel as a dev dependency.
jQuery 已经作为开发依赖包含在这个版本的 laravel 中。
You just have to run:
你只需要运行：
npm install
This first command will install the dependencies. jquery will be added.
第一个命令将安装依赖项。将添加 jquery。
Version 6.* and 7*
版本 6.* 和 7*
jQuery has been taken out of laravel that means you need to import it manually.
jQuery 已从 laravel 中移除，这意味着您需要手动导入它。
I'll import it here as a development dependency:
我将它作为开发依赖项导入这里：
npm i -D jquery
Then add it to the bootstrap.js file in resources/js/bootstrap.js You may notice that axios and lodash are imported there as well so in the same way we can import jquery.
然后将其添加到 resources/js/bootstrap.js 中的 bootstrap.js 文件中。您可能会注意到 axios 和 lodash 也在那里导入，因此我们可以导入 jquery 的方式相同。
Just add wherever you want there:
只需添加任何你想要的地方：
//In resources/js/bootstrap.js
window.$ = require('jquery');
If you follow this process in the 5.* version it won't affect laravel buy it will install a more updated version of jquery.
如果你在 5.* 版本中遵循这个过程，它不会影响 Laravel 购买它会安装更新版本的 jquery。
回答by Conor
You can link libraries from cdn(Content delivery network):
您可以从cdn（内容交付网络）链接库：
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
Or link libraries locally, add css files in the css folder and jquery in js folder. You have to keep both folders in the laravel public folder then you can link like below:
或者本地链接库，在css文件夹中添加css文件，在js文件夹中添加jquery。您必须将这两个文件夹都保存在 Laravel 公共文件夹中，然后您可以像下面这样链接：
<link rel="stylesheet" href="{{asset('css/bootstrap-theme.min.css')}}">
<script src="{{asset('js/jquery.min.js')}}"></script>
or else
要不然
{{ HTML::style('css/style.css') }}
{{ HTML::script('js/functions.js') }}
If you link js files and css files locally (like in the last two examples) you need to add jsand cssfiles to the jsand cssfolders which are in public\jsor public\cssnot in resources\assets.
如果你（在最后两个例子等）本地链接js文件和css文件，你需要添加js和css文件到js和css它在文件夹中public\js或者public\css不中resources\assets。
回答by SherlockMac
In Laravel 6 you can get it like this:
在 Laravel 6 中，你可以这样得到：
try {
window.$ = window.jQuery = require('jquery');
} catch (e) {}
