Laravel 混合生成相对路径
Laravel mix generates relative paths
在生产环境中,加载我使用的资产,例如:
<link href="{{ mix('/css/app.css') }}" rel="stylesheet">
并希望在编译时看到:
<link href="https://example.com/css/app.083fd04ba374238b03b23e742c997718.css" rel="stylesheet">
但是我只看到了相对路径:
<link href="/css/app.083fd04ba374238b03b23e742c997718.css" rel="stylesheet">
webpack.mix.js:
mix
.js('resources/assets/js/app.js', 'public/js')
.sass('resources/assets/sass/app.scss', 'public/css')
.sass('resources/assets/sass/print.scss', 'public/css')
.copy([
'node_modules/bootstrap-sass/assets/fonts/bootstrap',
'node_modules/font-awesome/fonts',
], 'public/fonts')
.sourceMaps();
if (mix.config.inProduction) {
mix
.version()
.disableNotifications();
} else {
//
}
在最新版本 Laravel (5.4.21) 上。使用 nginx,在 Ubuntu 16.04 上强制使用 https。不知道为什么路径不是完整的,而是相对的。
编辑: 如果我尝试使用 mix
与 asset
,而不使用 https
,我也会在本地看到相同的行为。实际上协议在这里似乎并不重要。
如果您查看 source,这就是它设计的工作方式。你总是可以写你自己的助手。
您需要将其添加到 helpers 文件中。
use Illuminate\Support\Str;
use Illuminate\Support\HtmlString;
if (! function_exists('mixUrl')) {
/**
* Get the path to a versioned Mix file.
*
* @param string $path
* @param string $manifestDirectory
* @param string $baseUrl
* @return \Illuminate\Support\HtmlString
*
* @throws \Exception
*/
function mixUrl($path, $manifestDirectory = '', $baseUrl = null)
{
static $manifest;
if (! starts_with($path, '/')) {
$path = "/{$path}";
}
if ($manifestDirectory && ! starts_with($manifestDirectory, '/')) {
$manifestDirectory = "/{$manifestDirectory}";
}
if (file_exists(public_path($manifestDirectory.'/hot'))) {
return new HtmlString("//localhost:8080{$path}");
}
if (! $manifest) {
if (! file_exists($manifestPath = public_path($manifestDirectory.'/mix-manifest.json'))) {
throw new Exception('The Mix manifest does not exist.');
}
$manifest = json_decode(file_get_contents($manifestPath), true);
}
if (!is_null($baseUrl)){
if (strlen($baseUrl) > 1 && Str::endsWith($baseUrl, '/')) {
$baseUrl = substr($baseUrl, 0, -1);
}
return new HtmlString($baseUrl . $manifestDirectory . $manifest[$path]);
}
if (! array_key_exists($path, $manifest)) {
throw new Exception(
"Unable to locate Mix file: {$path}. Please check your ".
'webpack.mix.js output paths and try again.'
);
}
return new HtmlString($manifestDirectory.$manifest[$path]);
}
}
来自 blade 喜欢
<script src="{{ mixUrl('/css/app.css', '', 'http://example.com') }}"></script>
处理此问题的最佳方法是使用 asset() 帮助程序在您的 APP_URL.
前面添加
<script src="{{ asset(mix('css/app.css')) }}"></script>
最好的方法是使用 asset()
助手。但是还有另一种方法可以通过使用 url()
或 secure_url()
helper
来处理这个问题
<script src="{{ url(mix('css/app.css')) }}"></script>
或
<script src="{{ secure_url(mix('css/app.css')) }}"></script>
这是我从 laravel 5 上的 TwigExtension 调用的函数。* 你可以做一个辅助函数。
// use Illuminate\Foundation\Mix;
function mix_url($path, $manifestDirectory = ''){
return asset(app(Mix::class)(...func_get_args()));
}
您还需要在 .env
上定义 ASSET_URL
在生产环境中,加载我使用的资产,例如:
<link href="{{ mix('/css/app.css') }}" rel="stylesheet">
并希望在编译时看到:
<link href="https://example.com/css/app.083fd04ba374238b03b23e742c997718.css" rel="stylesheet">
但是我只看到了相对路径:
<link href="/css/app.083fd04ba374238b03b23e742c997718.css" rel="stylesheet">
webpack.mix.js:
mix
.js('resources/assets/js/app.js', 'public/js')
.sass('resources/assets/sass/app.scss', 'public/css')
.sass('resources/assets/sass/print.scss', 'public/css')
.copy([
'node_modules/bootstrap-sass/assets/fonts/bootstrap',
'node_modules/font-awesome/fonts',
], 'public/fonts')
.sourceMaps();
if (mix.config.inProduction) {
mix
.version()
.disableNotifications();
} else {
//
}
在最新版本 Laravel (5.4.21) 上。使用 nginx,在 Ubuntu 16.04 上强制使用 https。不知道为什么路径不是完整的,而是相对的。
编辑: 如果我尝试使用 mix
与 asset
,而不使用 https
,我也会在本地看到相同的行为。实际上协议在这里似乎并不重要。
如果您查看 source,这就是它设计的工作方式。你总是可以写你自己的助手。
您需要将其添加到 helpers 文件中。
use Illuminate\Support\Str;
use Illuminate\Support\HtmlString;
if (! function_exists('mixUrl')) {
/**
* Get the path to a versioned Mix file.
*
* @param string $path
* @param string $manifestDirectory
* @param string $baseUrl
* @return \Illuminate\Support\HtmlString
*
* @throws \Exception
*/
function mixUrl($path, $manifestDirectory = '', $baseUrl = null)
{
static $manifest;
if (! starts_with($path, '/')) {
$path = "/{$path}";
}
if ($manifestDirectory && ! starts_with($manifestDirectory, '/')) {
$manifestDirectory = "/{$manifestDirectory}";
}
if (file_exists(public_path($manifestDirectory.'/hot'))) {
return new HtmlString("//localhost:8080{$path}");
}
if (! $manifest) {
if (! file_exists($manifestPath = public_path($manifestDirectory.'/mix-manifest.json'))) {
throw new Exception('The Mix manifest does not exist.');
}
$manifest = json_decode(file_get_contents($manifestPath), true);
}
if (!is_null($baseUrl)){
if (strlen($baseUrl) > 1 && Str::endsWith($baseUrl, '/')) {
$baseUrl = substr($baseUrl, 0, -1);
}
return new HtmlString($baseUrl . $manifestDirectory . $manifest[$path]);
}
if (! array_key_exists($path, $manifest)) {
throw new Exception(
"Unable to locate Mix file: {$path}. Please check your ".
'webpack.mix.js output paths and try again.'
);
}
return new HtmlString($manifestDirectory.$manifest[$path]);
}
}
来自 blade 喜欢
<script src="{{ mixUrl('/css/app.css', '', 'http://example.com') }}"></script>
处理此问题的最佳方法是使用 asset() 帮助程序在您的 APP_URL.
前面添加<script src="{{ asset(mix('css/app.css')) }}"></script>
最好的方法是使用 asset()
助手。但是还有另一种方法可以通过使用 url()
或 secure_url()
helper
<script src="{{ url(mix('css/app.css')) }}"></script>
或
<script src="{{ secure_url(mix('css/app.css')) }}"></script>
这是我从 laravel 5 上的 TwigExtension 调用的函数。* 你可以做一个辅助函数。
// use Illuminate\Foundation\Mix;
function mix_url($path, $manifestDirectory = ''){
return asset(app(Mix::class)(...func_get_args()));
}
您还需要在 .env
上定义 ASSET_URL