Symfony 4:使用Webpack编译的JS和CSS返回404 [英] Symfony 4 : JS and CSS compiled with Webpack return 404

问题描述

我正在用Symfony4和VueJs构建一个项目，该项目由nginx服务器托管并与Docker一起运行.我的模板还可以，但是css和js文件在404中.

I'm building a project with Symfony4 and VueJs, hosted by nginx server and run with Docker. My templates are OK but css and js files are in 404.

这是我的nginx配置:

Here's my nginx configuration :

server {
    listen 80;
    listen [::]:80;
    server_name symfony.local;
    root /var/www/myproject/public;

    location / {
        try_files $uri /index.php$is_args$args;
    }

    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;
}

我配置了我的webpack文件:

I configured my webpack file :

var Encore = require('@symfony/webpack-encore');
Encore
  .setOutputPath('public/build/')
  .setPublicPath('/build')
  .cleanupOutputBeforeBuild()
  .enableSourceMaps(!Encore.isProduction())
  .addEntry('app', './assets/js/app.js')
  .enableBuildNotifications()
  .enableSassLoader()
  .enableVueLoader();
;

module.exports = Encore.getWebpackConfig();

Css和JS文件位于目录assets\js\*和assets\css\*中，当我使用yarn encore dev进行编译时，我构建的文件位于public\build\app.js和public\build\app.css中 在模板base.html.twig中:

Css and JS files are in directory assets\js\* and assets\css\* and when i compile with yarn encore dev my builded files are in public\build\app.js and public\build\app.css In template base.html.twig :

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

还有

{% block javascripts %}
  {{ encore_entry_script_tags('app') }}
{% endblock %}

文件也被编译，但是app.js和app.css出现错误404. 我已经按照 https://symfony.com/doc/current/frontend中的说明进行了解释. html 所以我不明白缺少了什么.

Files are compiled as well but I have error 404 for app.js and app.css. I've made like it's explained in https://symfony.com/doc/current/frontend.html So i don't understand what is missing.

谢谢:)

推荐答案

问题已解决，它在docker-compose.yml中: 在容器nginx中，我忘记了批量安装我的应用程序的路径，它仅适用于PHP容器

Problem solved, it was in docker-compose.yml : In container nginx, i have forgotten to mount in volume the path to my application, it was only for PHP container

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/my-symfony-project: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;'"

这篇关于Symfony 4:使用Webpack编译的JS和CSS返回404的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！