- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在使用 webpacker gem 构建 Rails 5.2 应用程序。
我按照安装说明进行操作,因此我拥有了 app/javascript/packs/application.js
文件,以及 <%= javascript_pack_tag 'application' %>
在我的布局中。
启动我的 unicorn 服务器后,bin/webpack-dev-server
进程,我正在访问该应用程序,网络浏览器的网络选项卡显示他无法下载 /packs/application-bdddc5e750615fa56298.js
由于来自 webpack 服务器的文件结束错误(500 错误),我的服务器上的文件。
做一个 ls -al
在public/packs
文件夹显示以下内容:
drwxr-xr-x 2 zedtux zedtux 4096 Apr 4 16:35 .
drwxr-xr-x 16 zedtux root 4096 Apr 4 16:35 ..
-rw-r--r-- 1 zedtux zedtux 352 Apr 4 16:35 manifest.json
还有 manifest.json
包含:
{
"application.js": "/packs/application-bdddc5e750615fa56298.js",
"application.js.map": "/packs/js/application-45e23109c9e9d11521f0.hot-update.js.map",
"entrypoints": {
"application": {
"js": [
"/packs/application-bdddc5e750615fa56298.js"
],
"js.map": [
"/packs/application-bdddc5e750615fa56298.js.map",
"/packs/js/application-45e23109c9e9d11521f0.hot-update.js.map"
]
}
}
}
这是我的 config/webpacker.yml
文件:
# Note: You must restart bin/webpack-dev-server for changes to take effect
default: &default
source_path: app/javascript
source_entry_path: packs
public_root_path: public
public_output_path: packs
cache_path: tmp/cache/webpacker
check_yarn_integrity: false
webpack_compile_output: false
# Additional paths webpack should lookup modules
# ['app/assets', 'engine/foo/app/assets']
resolved_paths: []
# Reload manifest.json on all requests so we reload latest compiled packs
cache_manifest: false
# Extract and emit a css file
extract_css: false
static_assets_extensions:
- .jpg
- .jpeg
- .png
- .gif
- .tiff
- .ico
- .svg
- .eot
- .otf
- .ttf
- .woff
- .woff2
extensions:
- .mjs
- .js
- .sass
- .scss
- .css
- .module.sass
- .module.scss
- .module.css
- .png
- .svg
- .gif
- .jpeg
- .jpg
local:
<<: *default
compile: true
# Verifies that versions and hashed value of the package contents in the project's package.json
check_yarn_integrity: true
# Reference: https://webpack.js.org/configuration/dev-server/
dev_server:
https:
key: |
-----BEGIN PRIVATE KEY-----
...
-----END PRIVATE KEY-----
cert: |
-----BEGIN CERTIFICATE-----
...
-----END CERTIFICATE-----
cacert: |
-----BEGIN CERTIFICATE-----
...
-----END CERTIFICATE-----
host: 0.0.0.0
port: 3035
public: 0.0.0.0:3035
hmr: true
# 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
headers:
'Access-Control-Allow-Origin': '*'
watch_options:
ignored: '**/node_modules/**'
test:
<<: *default
compile: true
# Compile test packs to a separate directory
public_output_path: packs-test
production:
<<: *default
# Production depends on precompilation of packs prior to booting for performance.
compile: false
# Extract and emit a css file
extract_css: true
# Cache manifest.json for performance
cache_manifest: true
这个app是用local作为开发环境,所以我把development key重命名为local
顺便说一句,我启用了 hmr
,但即使禁用它,我也会得到相同的结果。
为什么文件夹里没有写文件?我该如何解决这个问题?
当我停止 bin/webpack-dev-server
进程,我重新加载页面,webpack 重新编译,文件在网络浏览器中正确加载。
在新选项卡中打开包 URL 显示 500 错误。我注意到包 URL 缺少 3035 端口。添加它会返回预期的 JavaScript 代码。
那么如何修复它以便包 URL 包含服务器端口?
最佳答案
我终于弄清楚我的设置出了什么问题。
我了解到的第一件事是,在 bin/webpack-dev-server
运行的情况下,当它捕获请求以便为它们提供服务时, Assets 文件不会写入 public/packs
文件夹了。另一方面,当停止服务器时,文件会写入磁盘,因为它们必须由 Rails 提供服务。
然后我意识到一切都与我的环境有关:我正在使用 Docker 和 docker-compose 运行我的应用程序 + 我正在使用 Nginx 反向代理 (jwilder/nginx-proxy)。
我正在使用 docker-compose exec app bin/webpack-dev-server
运行 bin/webpack-dev-server
以使其与 Rails 一起运行.
解决我的问题:
docker-compose.yml
文件中声明了一个新容器,它有一个 VIRTUAL_HOST
等于 webpack.mydomain.co
并监听端口 3035。config/webpacker.yml
文件,不再使用 https
(因为 nginx 正在处理),并更改了 host
和 public
到 webpack.mydomain.co
webpack.mydomain.co
。完成后,页面加载没有任何问题,HMR 工作正常,因为 Hello World from Webpacker
消息在 Chrome 控制台中刷新,而无需重新加载当前页面。
我希望这可以帮助人们:)
关于ruby-on-rails - Webpacker 仅创建 manifest.json 文件,因此缺少 Assets ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55518935/
当在 python 包中包含外部文件时,我在 MANIFEST.in 中将其定义为 MANIFEST.in include aikif/web_app/static/* 构建包将生成一个 MANIFE
我们使用 java 插件的 manifest 属性将 MANIFEST.MF 文件写入我们的 jar 工件。 我们还使用 gradle 构建 GWT 项目,并且我们为这些项目定义的输出是 zip。我想
感谢您的阅读! 当我做 docker-compose up在 laradock 上,我终于收到了一个类似标题的错误。 在这种情况下,有人知道正确的解决方案吗? 原来我有那个laradock,但我不小心
我收到以下错误,但我的 list 文件没有问题。 我尝试更改项目名称,但更改项目名称后出现此错误。帮助我解决此错误,而无需将项目名称更改回旧名称。 我的旧项目名称是“radio”,我的新项目名称是“M
错误: list 文件没有以最后的换行符结尾... 检查 list 文件是否以最后的换行符结尾(按照 JAR 规范的要求) 应为“:” 这是 AndroidManifest
大家好! 我在部署 Shiny App 时遇到问题。部署应用程序时,我得到以下控制台输出: Preparing to deploy application...DONE Uploading bundl
我开始使用 Android 进行开发。我将 SDK 23 与 Android M 权限的系统一起使用。在互联网的例子中,当我想检查权限时,我发现: this.checkSelfPermission(M
使用 SHA256 摘要标识符 拉取图像失败 最佳答案 不幸的是,这是 DockerHub 删除 Docker 1.9 守护进程的向后兼容性的副作用。当使用 Docker 1.10 推送图像时,较旧的
我正在使用 Next.js 开发一个服务器端渲染网站,我想让它成为一个渐进式 Web 应用程序,但问题是我找不到让它正确发生的方法。 当我构建应用程序时,它可以正确地为 service worker
我在 Windows 上使用 Docker,当我尝试使用此命令提取 PHP 镜像时 $ docker pull php 我收到这条消息: Using default tag: latest lates
我收到错误消息“标记属性包具有无效字符‘’。”在 Android Manifest 中,虽然没有明显的无效字符。这是代码:
我是 JavaScript 开发新手。我正在尝试制作一个可以在 iOS 和 Android 设备上离线运行的应用程序。我在没有示例的情况下学习时遇到困难,而且我找不到满足我需要的示例。 这是我发现的;
我在 Windows 上使用 Docker,当我尝试使用此命令提取 PHP 镜像时 $ docker pull php 我收到了这条消息: Using default tag: latest late
以下是我的代码:。AndroidManifest.xml。在MainActivity.Java中
当我安装 ExtUtils::Manifest 时,perl 推荐我安装 ExtUtils::Manifest。 操作系统为Win10,perl版本为strawberry-perl-5.24.4.1-
我一直在仔细阅读 app.manifest,但我不明白。好吧,我确实知道您需要它来做一些事情,例如:我们确实需要和使用。但还有这个: 这是我没有得到的部分,我可以将其忽略而不会有任何后果,对吗?我们
我创建了一个类如下: #include #define DLLEXPORT _declspec( dllexport ) using namespace std; class DLLEXPORT
我在使用webpack运行应用程序时遇到问题,出现以下错误: URIError: Failed to decode param '/%PUBLIC_URL%/manifest.json' at
我可以使用 Java 执行此操作吗? 我指的是 在 Android list 中 如果不能,我至少可以提供可供用户选择的替代方案吗? 最佳答案 看this and the asker referen
使用maven得到编译好的*.war文件,其中包含: - META-INF - - MANIFEST.MF - WEB-INF - - classes - - lib - - web.xml 使用 j
我是一名优秀的程序员,十分优秀!