16

I am trying to include

<link href="{{ asset('css/mystyle.css') }}"
      rel="stylesheet"/> 

in my twig file and render it. But it gives me Uncaught PHP Exception Twig_Error_Runtime:

"An exception has been thrown during the rendering of a template ("Asset manifest file "/../public/build/manifest.json" does not exist.")

It does work when i use

link href="css/mystyle.css"
          rel="stylesheet"/>

. Following is my controller:

    <?php

namespace App\Controller;

use Symfony\Component\Routing\Annotation\Route;
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\HttpFoundation\Response;

class WelcomeController extends AbstractController
{
    /**
     * @Route("/", name="welcome")
     */
    public function index()
    {
        return $this->render('welcome/index.html.twig');
    }
}

Following is my twig template:

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>Let's Explore Symfony 4</title>

    <!-- Bootstrap core CSS -->
    <link rel="stylesheet"
          href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.3/css/bootstrap.min.css"
          integrity="sha384-Zug+QiDoJOrZ5t4lssLdxGhVrurbmBWopoEl+M6BdEfwnCJZtKxi1KgxUyJq13dy"
          crossorigin="anonymous">

    <link href="{{ asset('css/mystyle.css') }}"
          rel="stylesheet"/>

</head>

<body>
<header>
    <nav class="navbar navbar-expand-sm navbar-dark bg-dark">
        <div class="container">

            <a class="navbar-brand" href="#">Home</a>

            <div class="collapse navbar-collapse">
                <ul class="navbar-nav mr-auto">
                    <li class="nav-item">
                        <a class="nav-link" href="#">Hello Page</a>
                    </li>
                </ul>
            </div>
        </div>

    </nav>
</header>

<main role="main" class="container main">
    <div>
        <h1>Let's Explore Symfony 4</h1>
        <p class="lead">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras rutrum sapien mauris, venenatis
            facilisis neque tincidunt vel. Maecenas vel felis vel turpis scelerisque eleifend. Fusce nec purus egestas,
            efficitur nisi ac, ultrices nulla. Pellentesque eu mollis tortor, in mollis nisl. Maecenas rhoncus quam non
            lacinia mollis.</p>
    </div>
</main>
</body>
</html>

How can i resolve this issue?

CJ Dennis
  • 3,676
  • 2
  • 32
  • 53
Bijaya Basnet
  • 181
  • 1
  • 1
  • 6
  • Did you execute bin/console asset:install before? – Łukasz Jakubek Jul 18 '18 at 04:59
  • All solutions below did not solve my problem. Any other suggestions? – Ham Dong Kyun Jul 22 '18 at 02:43
  • The answer from Sarath Kumar should help. As the error points out, the `manifest.json` doesn't exist. It can be automatically created once the assets are compiled. Eventually jsut the command `yarn encore dev` can resolve the problem. – cezar Oct 11 '18 at 09:26
  • You're assets are managed by webpack-encore so you'll just have to update your code. Remove the asset(...) method and expose it's content. Webpack should handle your assets for you. Update your code from this `` to this ` ` – sylvery Feb 17 '20 at 04:27

6 Answers6

21

Execute the below commands:

yarn add --dev @symfony/webpack-encore

yarn add webpack-notifier --dev

yarn encore dev

It will generate the manifest.json file

Sangam Belose
  • 3,327
  • 8
  • 25
  • 38
Sarath Kumar
  • 549
  • 1
  • 6
  • 11
  • 1
    This is the right answer. For me it was enough to run `yarn install` and `yarn encore dev` after installing the Webpack Encore with `composer`. The official [documentation](https://symfony.com/doc/current/frontend/encore/simple-example.html) is very good and contains everything. – cezar Oct 11 '18 at 09:24
9

I have resolved this problem by not using json_manifest_path: ~

comment out the json_manifest_path by adding '#' in front of it and add '~' after 'assets:'

framework:
    assets: ~
        #json_manifest_path: '%kernel.project_dir%/public/build/manifest.json'
Ham Dong Kyun
  • 555
  • 2
  • 19
2

yarn encore dev-server --hot creates the manifest.json file

Sanne
  • 1,086
  • 10
  • 17
0

manifest.json is new in Symfony 3.3.

So, you should have this lines in your config file :

# app/config/config.yml
framework:
    # ...
    assets:
        json_manifest_path: '%kernel.root_dir%/../web/build/manifest.json'

If manifest.json isn't exists, you should create it, like this :

{ "css/app.css": "build/css/mystyle.b916426ea1d10021f3f17ce8031f93c2.css", "...": "..." }

Allan
  • 31
  • 1
0

I have resolved this problem by not using json_manifest_path: ~

comment out the json_manifest_path by adding # in front of it and add ~ after assets:

framework:
    assets: ~
        #json_manifest_path: '%kernel.project_dir%/public/build/manifest.json'
nouvist
  • 614
  • 5
  • 15
-1

Remember that the question is tagged Symfony4!

I have the same issue to add logo in navbar, favicon…

In Symfony4, there are no more app directory, so no app/config/config.yml ! In Symfony4, web directory doesn't exist anymore but there are new directory public

As @Bijaya wrote, just specify href or src address in public

In my case, I have my logo: myProjectName/public/logo_mom.png

and in my controller, I have:

/**
 * @Route("/", name="home")
 */
public function home() {
    return $this->render('blog/home.html.twig', [
        'title' => "Bienvenue",
        'logo_path' => "logo_mom.png",
        'logo_alt' => "logo alt description",
    ]);
}

and in my home.html.twig:

{% block body %}
    <h1>{{ title }}</h1>
    <img src={{ logo_path }} alt={{ logo_alt}}>

and in my template/base.html.twig:

<link rel="icon" type="image/x-icon" href="favicon.ico" />

So for me who discover Symfony4 without previous Symfony version knowledge, it is nice that doesn't required asset function or any other configuration!

bcag2
  • 1,131
  • 1
  • 8
  • 20