Question

所以在Laravel中有Composer，NPM和Bower，我知道他们都是deoendancy经理。

Composer - 这似乎关注PHP依赖关系，包列表由composer.json的内容控制。要安装软件包，您可以添加到此文件或运行php composer install <package>。

NPM - 这似乎主要关注JavaScript依赖关系，但也有大量的软件包。 npm install安装的软件包由package.json文件的内容决定。

Bower - 据我所知这是针对前端套餐的吗？

在Laravel中，如果您愿意，可以使用全部三个，但如果可以通过npm和composer提供库，为什么要使用另一个？

例如，在安装Laravel时，他们有两个文件：

app.js - 您应用程序的主要js文件
bootstrap.js - 包含在app.js中以引入某些依赖项的文件

这是bootstrap.js

中resources/js的内容

window._ = require('lodash');
window.Popper = require('popper.js').default;

/**
 * We'll load jQuery and the Bootstrap jQuery plugin which provides support
 * for JavaScript based Bootstrap features such as modals and tabs. This
 * code may be modified to fit the specific needs of your application.
 */

try {
    window.$ = window.jQuery = require('jquery');

    require('bootstrap');
    require('slick-carousel');
    require('isotope-layout/dist/isotope.pkgd.min.js');
    require('tablesorter/dist/js/jquery.tablesorter.combined.min.js');
} 

catch (e) {}

/**
 * We'll load the axios HTTP library which allows us to easily issue requests
 * to our Laravel back-end. This library automatically handles sending the
 * CSRF token as a header based on the value of the "XSRF" token cookie.
 */

window.axios = require('axios');

window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';

/**
 * Next we will register the CSRF Token as a common header with Axios so that
 * all outgoing HTTP requests automatically have it attached. This is just
 * a simple convenience so we don't have to attach every token manually.
 */

let token = document.head.querySelector('meta[name="csrf-token"]');

if (token) {
    window.axios.defaults.headers.common['X-CSRF-TOKEN'] = token.content;
} else {
    console.error('CSRF token not found: https://laravel.com/docs/csrf#csrf-x-csrf-token');
}

/**
 * Echo exposes an expressive API for subscribing to channels and listening
 * for events that are broadcast by Laravel. Echo and event broadcasting
 * allows your team to easily build robust real-time web applications.
 */

// import Echo from 'laravel-echo'

// window.Pusher = require('pusher-js');

// window.Echo = new Echo({
//     broadcaster: 'pusher',
//     key: process.env.MIX_PUSHER_APP_KEY,
//     cluster: process.env.MIX_PUSHER_APP_CLUSTER,
//     encrypted: true
// });

在app.css我有这个：

/* 
 * This file takes all of the styling we need and compiles it into one nice CSS file.
 * You'll notice you can pull in anything from the node_modules folder use a Tiddle (~)
*/

@import '~bootstrap/dist/css/bootstrap.min.css'; // Bootstrap 3.3.7 CSS
@import '~slick-carousel/slick/slick.css';       // Slick Carousel base CSS

@import "variables";                             // Sass Variables

@import "partials/typography";                   // All from this point are from the partials folder
@import "partials/mixins";
@import "partials/helpers";
@import "partials/navigation";
@import "partials/breadcrumb-bar";
@import "partials/welcome-box";
@import "partials/form-box";
@import "partials/content-box";
@import "partials/carousels";
@import "partials/tables";
@import "partials/interactions-row";
@import "partials/downloads-area";
@import "partials/articles-events";
@import "partials/biography-pages";
@import "partials/grid";
@import "partials/footer";
@import "partials/steve-custom.scss";

真正让我失望的是：app.js如何知道我引用node_modules文件夹中的文件夹以及app.css如何知道我＆＃39} ; m只是使用~来引用Bootstrap？

为什么我不必指定绝对路径？

一般的经验法则是JavaScript相关项通常来自npm而PHP依赖项来自composer？

我的困惑是因为我正在查看一个名为Laravel Full Calendar的软件包，它的样式和JS代码似乎是通过npm引入的，但它的PHP依赖部分是从Composer中提取的？

这是正常行为吗？

我觉得这里有很多问题，但我觉得Laracasts真的没有解释这些包管理器的实际用法。

Answer 1

首先简要说明三个依赖项管理器。

作曲家

Composer是用于管理 PHP 依赖性的工具。它使用Packagist获取有关依赖项的信息并为您正确安装它们。

NPM

NPM是Node生态系统的一部分，主要用于管理Node.js应用程序的依赖项。但是，随着Node变得越来越流行，人们开始将NPM不仅用于Node.js模块。现在，管理您的 JavaScript 依赖项是准标准。

鲍尔

类似于NPM，Bower管理 JavaScript 依赖性。但是，Bower的创建是为了从整个Node模块生态系统中分离用于前端开发的软件包（例如Bootstrap，jQuery等），并且还提供CSS的软件包管理器。它提供/提供了NPM不提供或不提供的某些功能。

总结：Composer用于PHP软件包，NPM和Bower用于JavaScript软件包。我很确定没有Composer和NPM可用的软件包，因为它们专注于两种截然不同的编程语言。但是，Bower可以由NPM代替，反之亦然。在我看来，Bower有点过时，因为还有其他一些工具要先进得多，并且大多数项目仅将NPM用于依赖项管理。

让我们继续您的问题。

app.js如何知道我指的是node_modules文件夹中的文件夹，app.css如何知道我仅通过使用〜来指代Bootstrap？

知道波浪号（~）是node_modules目录的同义词的不是文件本身。正是编译器[1]知道它应该在提到代字号的目录中查找包。
请注意，代字号> node_modules同义词是CSS开发而非JavaScript的概念。

为什么我不必指定绝对路径？

可以。您也可以使用相对路径。或波浪号。实际上，它没有任何区别。这仅取决于您使用的编译器。

一般的经验法则是JavaScript相关项目通常来自npm，PHP依赖项来自作曲家？

这不是经验法则，这是必须做的。您将无法通过NPM找到PHP模块，反之亦然。

我之所以感到困惑，是因为我在看一个名为Laravel Full Calendar的软件包，它的样式和JS代码似乎是通过npm提取的，但其PHP相关部分是从Composer提取的？

绝对合理。如果您有一个Laravel软件包，它将对Fullcalendar的支持添加到您的应用程序中，那么我将创建一个独立于NPM软件包的PHP软件包。 PHP程序包构建HTML，而NPM程序包仅提供CSS和JavaScript。
我不会说这是正常行为，但正如我所说的那样，完全合理。

希望我能以您理解此事的方式回答您的问题。我同意，依赖管理的整个概念及其差异并不是那么容易理解。如果还有其他问题，请发表评论。

[1]编译器>可以是将app.scss转换为app.css的任何模块。例如node-sass。

Laravel中NPM，Composer和Bower的区别？

1 个答案:

作曲家

NPM

鲍尔