[RESOLU] [Symfony 4] CSS et JS en 404

Eléphant du PHP | 395 Messages

14 déc. 2018, 17:36

Je viens de commencer un projet en Symfony 4 et j'ai un soucis avec les fichiers compilés par webpack.encore : ils sont en 404.
Mes pages sont donc toute vide de style.
Ma configuration de webpack.encore :

Code : Tout sélectionner

var Encore = require('@symfony/webpack-encore'); var CopyWebpackPlugin = require('copy-webpack-plugin'); Encore // directory where compiled assets will be stored .setOutputPath('public/build/') // public path used by the web server to access the output path .setPublicPath('/build') .cleanupOutputBeforeBuild() .enableSourceMaps(!Encore.isProduction()) /* * ENTRY CONFIG * * Add 1 entry for each "page" of your app * (including one that's included on every page - e.g. "app") * * Each entry will result in one JavaScript file (e.g. app.js) * and one CSS file (e.g. app.css) if you JavaScript imports CSS. */ .addEntry('app', './assets/js/app.js') // will require an extra script tag for runtime.js // but, you probably want this, unless you're building a single-page app .enableSingleRuntimeChunk() // enables Sass/SCSS support .enableSassLoader() .addPlugin(new CopyWebpackPlugin([ { from: './assets/images', to: 'images' } ])) .enableVueLoader(); ; module.exports = Encore.getWebpackConfig();
Mes fichiers sources sont bien présent dans le dossiers assets et lors de la compilation avec
yarn encore dev
les fichiers compilés apparaissent bien dans le dossier
public\build\
.
Mon base.html.twig :

Code : Tout sélectionner

{% block stylesheets %} {{ encore_entry_link_tags('app') }} {% endblock %}
et

Code : Tout sélectionner

{% block javascripts %} {{ encore_entry_script_tags('app') }} {% endblock %}
Générant dans le DOM
<link rel="stylesheet" href="/build/app.css">
et
<script src="/build/runtime.js"></script><script src="/build/app.js"></script>
. Suivant les différentes doc et tutos trouvés je n'arrive pas à voir ce que je fais de mal...
----------------------------------------------------------------------------------
www.april.org - Promouvoir et défendre le logiciel libre

Eléphant du PHP | 395 Messages

14 déc. 2018, 17:45

Précision : mon instance de dev est monté via une stack Docker avec container nginx/php-fpm.
Voici la configuration du vhost de nginx :

Code : Tout sélectionner

server { listen 80; listen [::]:80; server_name ${NGINX_HOST}; client_max_body_size 20M; root /var/www/my-sf-project/public; location / { try_files $uri /index.php$is_args$args; } location ~* \.(jpg|jpeg|gif|css|png|js|ico|html|eof|woff|ttf)$ { if (-f $request_filename) { expires 30d; access_log off; } } location ~ ^/(index)\.php(/|$) { fastcgi_pass php:9000; fastcgi_split_path_info ^(.+\.php)(/.*)$; include fastcgi_params; fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name; fastcgi_param HTTPS off; internal; } location ~ \.php$ { return 404; } error_log /var/log/nginx/symfony_error.log; access_log /var/log/nginx/symfony_access.log; }
----------------------------------------------------------------------------------
www.april.org - Promouvoir et défendre le logiciel libre

Mammouth du PHP | 645 Messages

16 déc. 2018, 23:18

Salut, si les fichiers sont bien dans le dossier public/build mais que, quand tu essaies de les ouvrir dans le navigateur, tu as une erreur 404, alors le problème vient très probablement de la configuration nginx.

Eléphant du PHP | 395 Messages

17 déc. 2018, 12:23

Hello,
Tu penses que le problème serait plutôt dans la configuration de nginx ou la configuration du vhost (comme décrit dans mon deuxième message) ?
Sachant que la configuration je ne l'ai pas touchée ou montée une configuration custom : j'utilise l'image docker "nginx:latest".
Voici comment je monte le container docker dans mon docker-compose.yml :

Code : Tout sélectionner

nginx: image: nginx:latest container_name: dso_nginx hostname: nginx ports: - 80:80 - 443:443 depends_on: - php volumes: - ./docker/nginx/default.template:/etc/nginx/conf.d/default.template - ./logs/nginx/:/var/log/nginx env_file: - .env environment: - NGINX_HOST=${NGINX_HOST} command: /bin/sh -c "envsubst '$$NGINX_HOST' < /etc/nginx/conf.d/default.template > /etc/nginx/conf.d/default.conf && nginx -g 'daemon off;'"
"./docker/nginx/default.template" est le fichier de configuration montré dans mon deuxième message dans lequel j'injecte la variable NGINX_HOST définie dans mon .env : il s'agit de mon nom d'alias : "symfony.local".
----------------------------------------------------------------------------------
www.april.org - Promouvoir et défendre le logiciel libre

Eléphant du PHP | 395 Messages

17 déc. 2018, 12:27

Ho, je viens d'avoir une idée : je ne monte pas dans mon container nginx le path de l'application, je fais ça uniquement dans le container PHP-FPM, le problème viendrait peut-être de là !!

EDIT : ça venait bien de là, merci de m'avoir mis sur la piste :), le container nginx :

Code : Tout sélectionner

nginx: image: nginx:latest container_name: dso_nginx hostname: nginx ports: - 80:80 - 443:443 depends_on: - php volumes: - ./docker/nginx/default.template:/etc/nginx/conf.d/default.template - ".:/var/www/deep-space-objects:ro" - ./logs/nginx/:/var/log/nginx env_file: - .env environment: - NGINX_HOST=${NGINX_HOST} command: /bin/sh -c "envsubst '$$NGINX_HOST' < /etc/nginx/conf.d/default.template > /etc/nginx/conf.d/default.conf && nginx -g 'daemon off;'"
----------------------------------------------------------------------------------
www.april.org - Promouvoir et défendre le logiciel libre

Mammouth du PHP | 645 Messages

17 déc. 2018, 23:55

Bravo =D>