我用docker安装了rails 6，我的webpacker似乎编译资产很好，但当我访问我的页面时，它给出了404
ActionController::RoutingError (No route matches [GET] "/packs/js/application-6527e9c4b100bc10bc71.js")
app | The Gemfile's dependencies are satisfied
webpack | ℹ ｢wds｣: Project is running at http://localhost:3035/
webpack | ℹ ｢wds｣: webpack output is served from /packs/
webpack | ℹ ｢wds｣: Content not from webpack is served from /app/public/packs
webpack | ℹ ｢wds｣: 404s will fallback to /index.html
app | => Booting Puma
app | => Rails 6.1.4 application starting in development
app | => Run `bin/rails server --help` for more startup options
app | Puma starting in single mode...
app | * Puma version: 5.3.2 (ruby 3.0.1-p64) ("Sweetnighter")
app | * Min threads: 5
app | * Max threads: 5
app | * Environment: development
app | * PID: 10
app | * Listening on http://0.0.0.0:3000
app | Use Ctrl-C to stop
webpack | ℹ ｢wdm｣: Hash: 81036c4ee13c6e27e31a
webpack | Version: webpack 4.46.0
webpack | Time: 931ms
webpack | Built at: 06/26/2021 4:38:56 PM
webpack | Asset Size Chunks Chunk Names
webpack | js/application-6527e9c4b100bc10bc71.js 1.76 MiB application [emitted] [immutable] application
webpack | js/application-6527e9c4b100bc10bc71.js.map 2.01 MiB application [emitted] [dev] application
webpack | js/server_rendering-13527221e10c2e65c45f.js 1.64 MiB server_rendering [emitted] [immutable] server_rendering
webpack | js/server_rendering-13527221e10c2e65c45f.js.map 1.88 MiB server_rendering [emitted] [dev] server_rendering
webpack | manifest.json 738 bytes [emitted]
webpack | ℹ ｢wdm｣: Compiled successfully.
app | Started GET "/" for 172.22.0.1 at 2021-06-26 16:39:02 +0000
app | (0.7ms) SELECT "schema_migrations"."version" FROM "schema_migrations" ORDER BY "schema_migrations"."version" ASC
app | Processing by HomeController#index as HTML
app | Rendering layout layouts/application.html.erb
app | Rendering home/index.html.erb within layouts/application
app | Post Load (0.8ms) SELECT "posts".* FROM "posts"
app | ↳ app/views/home/index.html.erb:1
app | Rendered home/index.html.erb within layouts/application (Duration: 13.2ms | Allocations: 12811)
app | [Webpacker] Everything's up-to-date. Nothing to do
app | Rendered layout layouts/application.html.erb (Duration: 17.8ms | Allocations: 17655)
app | Completed 200 OK in 24ms (Views: 15.3ms | ActiveRecord: 3.7ms | Allocations: 21885)
app |
app |
app | Started GET "/packs/js/application-6527e9c4b100bc10bc71.js" for 172.22.0.1 at 2021-06-26 16:39:02 +0000
app |
app | ActionController::RoutingError (No route matches [GET] "/packs/js/application-6527e9c4b100bc10bc71.js"):
Dockerfile
FROM ruby:3.0.1
ENV APP_PATH /app
ENV BUNDLE_VERSION 2.2.21
ENV BUNDLE_PATH /usr/local/bundle/gems
ENV TMP_PATH /tmp/
ENV RAILS_LOG_TO_STDOUT true
ENV RAILS_PORT 3000
# copy entrypoint scripts and grant execution permissions
COPY ./dev-docker-entrypoint.sh /usr/local/bin/dev-entrypoint.sh
COPY ./webpack-entrypoint.sh /usr/local/bin/webpack-entrypoint.sh
COPY ./test-docker-entrypoint.sh /usr/local/bin/test-entrypoint.sh
RUN chmod +x /usr/local/bin/dev-entrypoint.sh &&
chmod +x /usr/local/bin/test-entrypoint.sh &&
chmod +x /usr/local/bin/webpack-entrypoint.sh
# install dependencies for application
RUN apt update -qq && apt install -y
curl
libpq-dev
imagemagick
&& mkdir -p $APP_PATH
# Install node js
RUN curl -sL https://deb.nodesource.com/setup_16.x | bash -
RUN apt-get update && apt-get install -y nodejs
# install yarn
RUN npm i -g yarn
RUN gem install bundler --version "$BUNDLE_VERSION"
&& rm -rf $GEM_HOME/cache/*
RUN yarn install
# navigate to app directory
WORKDIR $APP_PATH
EXPOSE $RAILS_PORT
ENTRYPOINT [ "bundle", "exec" ]
docker compose.yml
version: '3'
volumes:
db_data:
gem_cache:
shared_data:
services:
redis:
image: redis:alpine
command: redis-server
volumes:
- shared_data:/var/shared/redis
postgres:
image: postgres:11.11
container_name: postgres
volumes:
- db_data:/var/lib/postgresql/data
- shared_data:/var/shared
environment:
POSTGRES_USER: postgres
POSTGRES_PASSWORD: password
ports:
- 5099:5432
webpack:
build:
context: .
dockerfile: Dockerfile.dev
container_name: webpack
entrypoint: webpack-entrypoint.sh
command: ['./bin/webpack-dev-server']
volumes:
- .:/app
- shared_data:/var/shared
- gem_cache:/usr/local/bundle/gems
ports:
- 3035:3035
app:
build:
context: .
dockerfile: Dockerfile.dev
container_name: app
volumes:
- .:/app
- shared_data:/var/shared
- gem_cache:/usr/local/bundle/gems
ports:
- 3000:3000
stdin_open: true
tty: true
env_file: .env.development
entrypoint: dev-entrypoint.sh
command: ['rails', 'server', '-p', '3000', '-b', '0.0.0.0']
environment:
RAILS_ENV: development
depends_on:
- webpack
- postgres
*-entrypoint.sh文件是非常简单的
#!/bin/sh
set -e
echo "Environment: $RAILS_ENV"
# install missing gems
bundle check || bundle install --jobs 20 --retry 5
# run passed commands
bundle exec ${@}
我希望这对其他人有帮助。
尽管查看日志很好，而且webpack似乎正在编译，但问题出在webpacker.yml文件中的webpackhost配置上。
默认webpack.yml配置
development:
<<: *default
compile: true
# Reference: https://webpack.js.org/configuration/dev-server/
dev_server:
https: false
host: localhost
port: 3035
public: localhost:3035
hmr: false
# Inline should be set to true if using HMR
inline: true
overlay: true
compress: true
disable_host_check: true
use_local_ip: false
quiet: false
pretty: false
headers:
'Access-Control-Allow-Origin': '*'
watch_options:
ignored: '**/node_modules/**'
将dev_server主机从localhost更改为webpack
注意：在我的情况下是
webpack，因为这是我的webpack docker容器的名称。
development:
<<: *default
compile: true
# Reference: https://webpack.js.org/configuration/dev-server/
dev_server:
https: false
host: webpack
port: 3035
public: webpack:3035
hmr: false
# Inline should be set to true if using HMR
inline: true
overlay: true
compress: true
disable_host_check: true
use_local_ip: false
quiet: false
pretty: false
headers:
'Access-Control-Allow-Origin': '*'
watch_options:
ignored: '**/node_modules/**'
最后在config/initializers/content_security_policy.rb中指定connect_src上的webpack主机
policy.connect_src :self, :https, "http://webpack:3035", "ws://webpack:3035" if Rails.env.development?