参考文章：https://laravel-china.org/articles/1714

以下封装的包的demo在：https://github.com/Lidisam/webUpload-for-laravel

接下来讲解如何将webupload封装成一个laravel的composer包 

这里针对的版本是laravel 5.2

①首先打开laravel目录，然后再app的同级目录下创建 packages/lisam/webupload/src

注：src目录存储开发包的代码

②修改laravel项目根目录的composer.json如下：

"autoload": {"classmap": [ "database" ],"psr-4": {"App\\": "app/","Lisam\\Webupload\\": "packages/lisam/webupload/src/" }
},

注：修改根目录的composer.json需要重新加载，命令为：composer dump-autoload

③在包的src的同级目录添加composer.json，并修改代码如下：

{"name": "lisam/webupload-for-laravel","description": "webupload for laravel5","authors": [{"name": "lisam","email": "364362035@qq.com"}],"require": {}
}

④创建服务提供者WebuploadServiceProvider

php artisan make:provider WebuploadServiceProvider

并将其从app/Providers/WebuploadServiceProvider.php移动到packages/lisam/webupload/src下,然后将WebuploadServiceProvider注册到config/app.php的providers下

'providers' => [/* * Laravel Framework Service Providers... */....../* * Application Service Providers... */......                  Lisam\Webupload\WebuploadServiceProvider::class,
],

⑤新建配置文件 packages/lisam/webupload/src/config/webupload.php 如下

<?phpreturn ['options' => []
];

⑥新建功能函数文件 packages/lisam/webupload/src/Webupload.php  (包含相干的资源文件js、css)

<?php namespace Lisam\Webupload;class Webupload
{/*** constructor.*/public function __construct(){}public function render(){
//        return view('Toastr::toastr', compact('javascript'));}/*** css资源文件*/public function css(){echo '<link rel="stylesheet" type="text/css" href="/packages/webUpload/css/webuploader.css" />' . PHP_EOL;echo '<link rel="stylesheet" type="text/css" href="/packages/webUpload/css/style.css"/>' . PHP_EOL;}/*** js资源文件*/public function js(){echo '<script type="text/javascript" src="/packages/webUpload/js/jquery.js"></script>' . PHP_EOL;echo '<script type="text/javascript" src="/packages/webUpload/js/webuploader.js"></script>' . PHP_EOL;echo '<script type="text/javascript" src="/packages/webUpload/js/upload.js"></script>' . PHP_EOL;}/*** 主体内容*/public function content(){echo '<div id="wrapper">' .'<div id="container">' .'<div id="uploader">' .'<div class="queueList">' .'<div id="dndArea" class="placeholder">' .'<div id="filePicker"></div>' .'<p>或将照片拖到这里，单次最多可选300张</p>' .'</div>' .'</div>' .'<div class="statusBar" style="display:none;">' .'<div class="progress">' .'<span class="text">0%</span>' .'<span class="percentage"></span>' .'</div>' .'<div class="info"></div>' .'<div class="btns">' .'<div id="filePicker2"></div>' .'<div class="uploadBtn">开始上传</div>' .'</div>' .'</div>' .'</div>' .'</div>' .'</div>';}
}

⑦注册门面Facade，新建packages/lisam/webupload/src/Facades/Webupload.php   

<?php namespace Lisam\Webupload\Facades;use Illuminate\Support\Facades\Facade;class Webupload extends Facade
{protected static function getFacadeAccessor(){return 'webupload';}
}

⑧修改providers

<?php namespace Lisam\Webupload;use Illuminate\Support\ServiceProvider;class WebuploadServiceProvider extends ServiceProvider
{/*** Bootstrap the application services.** @return void*/public function boot(){$this->publishes([__DIR__ . '/config/webupload.php' => config_path('webupload.php'),]);}/*** Register the application services.** @return void*/public function register(){$this->app['webupload'] = $this->app->share(function ($app) {return new Webupload();});}/*** Get the services provided by the provider.** @return array*/public function provides(){return ['webupload'];}
}

⑨修改config/app.php文件如下：

'aliases' => ['WebUpload' => Lisam\Webupload\Facades\Webupload::class,
],

⑩然后随便找一个控制器指向 根目录文件，并修改视图文件如下：

{{--设置token验证--}}
<meta name="_token" content="{{ csrf_token() }}"/>
{{--设置当前保存url--}}
<meta name="_url" content="/admin/good/webUpload?goods_id={{ $id }}"/>
{!! WebUpload::css() !!}
{!! WebUpload::content() !!}
{!! WebUpload::js() !!}

效果如下：

最终目录结构如下：