Webpack - Materialize with Symfony

0
votes

I'm running a project on Symfony. I want to use for the first Time, Symfony 4, Webpack and Vagrant/Homestead.

My host is a Windows 10 My project is host on a VM made with vagrant/Homestead on Debian Wabpack (yarn) is installed

So,

I've made an "assets" folder inside I have a "css" folder, a "js" folder and a "scss" folder.

I've run the command

yarn add materialize-css

And then I run

yarn encore dev --watch

(ofc I've run yarn install previously)

But when I run my Symfony Website... Materialize is not detected.. My console show me the followings errors :

GET http://website.test/build/app.css/ net::ERR_ABORTED 404 (Not Found) (index):16

GET http://website.test/build/manifest.js net::ERR_ABORTED 404 (Not Found) favicon.ico:1

GET http://website.test/favicon.ico 404 (Not Found)

Here is My base template :

<!DOCTYPE html>


    <meta charset="UTF-8">
    <title>{% block title %}Welcome!{% endblock %}</title>
    {% block stylesheets %}
    <link rel="stylesheet" href={{ asset("build/app.css") }}/>
    {% endblock %}
</head>
<body>
<h1 class="grey">It works !</h1>
<a class="waves-effect waves-light btn">button</a>
<a class="waves-effect waves-light btn"><i class="material-icons left">cloud</i>button</a>
<a class="waves-effect waves-light btn"><i class="material-icons right">cloud</i>button</a>

{% block body %}{% endblock %}
    {% block javascripts %}
        <script src={{ asset("build/app.js") }}></script>
        <script src={{ asset("build/manifest.js") }}></script>
    {% endblock %}
</body>

I don't know what to do what can do my website working ?

2
symfonywebpackmaterializesymfony4
Have you tried checking whether the files are really build, or whether the URL is incorrect? - Nico Haase
The manifest.js is the only one not present... But webpack have to generate this one no ? - NoobieNoob
So, app.js exists? And you provided proper hints for the routing, such that Symfony knows where to look for that file? - Nico Haase
Yes app.js exists. i didn't remember doing somehong special for the route... - NoobieNoob
I've tried to reset my project I'm having the same issue... - NoobieNoob

2 Answers

1
votes

If it's still not working you can try this:

<script src={{ asset("./build/app.js") }}></script>
<script src={{ asset("./build/runtime.js") }}></script>

<script src={{ asset("./build/vendors~app.js") }}></script>
//  for style
<link rel="stylesheet" href={{ asset("./build/app.css") }}/>

It worked for me.

0
votes

Fixed !

You have to do :

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

And not :

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