docker - VueJS Nginx 和 docker 设置 - 本地 ERR_EMPTY_RESPONSE
问题描述
这是我第一次使用 Docker,如果这让你在阅读本文时发疯了,我深表歉意。
我目前正在尝试使用 Nginx 和开发容器对我的 Vue 应用程序进行 dockerise(目前两者都不起作用)
我一直在无休止地学习教程,但由于我的文件夹结构不一样,所以一直在转圈,所以我一直收到这个OSError: [Errno 22] Invalid argument: '\\?\D:\GitHub\RepoName\website\node_modules\.bin\acorn'
错误
我的环境结构目前是(并且不能改变!)
RepoName
- Docker-Compose
- website
- Vue Application (Build, src, static, node modules)
-Dockerfile (Moved from Docker-Setup/Website)
-Nginx Conf (Moved from Docker-Setup/Website)
Docker-撰写
website:
container_name: tutorial
image: nginx:1.17
build:
context: ./website
volumes:
- ./website:/app
- ./app/node_modules
ports:
- "8080:80"
正如您在构建它时所看到的那样,它调用了 Dockerfile./website
#Docker file for VueJS using NGINX
# build stage
FROM node:lts-alpine as build-stage
WORKDIR /app
COPY package*.json ./
RUN apk add --update npm
RUN npm install @vue/cli@3.7.0 -g
RUN npm install
COPY . /app
RUN npm run build
# production stage
FROM nginx:stable-alpine as production-stage
COPY --from=build-stage . /usr/share/nginx/html
RUN rm /etc/nginx/conf.d/default.conf
COPY nginx.conf /etc/nginx/conf.d
ENV PORT = 8080
EXPOSE 8080
CMD ["nginx", "-g", "daemon off;"]
如果需要,我的 Nginx conf(从 VueJS Docker 设置复制)
server {
listen 8080;
location / {
root /usr/share/nginx/html/app;
index index.html index.htm;
try_files $uri $uri/ /index.html;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root /usr/share/nginx/html;
}
}
错误:
OSError: [Errno 22] 无效参数:'\\?\D:\GitHub\RepoName\website\node_modules\.bin\acorn'
在处理上述异常的过程中,又出现了一个异常:
Traceback (most recent call last):
File "docker-compose", line 3, in <module>
File "compose\cli\main.py", line 67, in main
File "compose\cli\main.py", line 126, in perform_command
File "compose\cli\main.py", line 1070, in up
File "compose\cli\main.py", line 1066, in up
File "compose\project.py", line 615, in up
File "compose\service.py", line 346, in ensure_image_exists
File "compose\service.py", line 1125, in build
File "site-packages\docker\api\build.py", line 160, in build
File "site-packages\docker\utils\build.py", line 31, in tar
File "site-packages\docker\utils\build.py", line 100, in create_archive
OSError: Can not read file in context: \\?\D:\GitHub\RepoName\website\node_modules\.bin\acorn
[16788] Failed to execute script docker-compose
更新
通过将其添加到固定节点问题(我认为).dockerignore
现在得到:
Error: Cannot find module '/app/build/build.js'
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:831:15)
at Function.Module._load (internal/modules/cjs/loader.js:687:27)
at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:60:12)
at internal/main/run_main_module.js:17:47 {
code: 'MODULE_NOT_FOUND',
requireStack: []
}
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! project@1.0.0 build: `node build/build.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the project@1.0.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /root/.npm/_logs/2020-10-12T10_36_28_384Z-debug.log
现在解决了这个问题,现在到下一个......
ERROR in Error: Child compilation failed:
Entry module not found: Error: Can't resolve '/app/index.html' in '/app':
Error: Can't resolve '/app/index.html' in '/app'
- compiler.js:76
[app]/[html-webpack-plugin]/lib/compiler.js:76:16
- Compiler.js:300
[app]/[webpack]/lib/Compiler.js:300:11
- Compiler.js:510
[app]/[webpack]/lib/Compiler.js:510:14
- Tapable.js:202 next
[app]/[tapable]/lib/Tapable.js:202:11
- CachePlugin.js:78 Compiler.<anonymous>
[app]/[webpack]/lib/CachePlugin.js:78:5
- Tapable.js:206 Compiler.applyPluginsAsyncSeries
[app]/[tapable]/lib/Tapable.js:206:13
- Compiler.js:507
[app]/[webpack]/lib/Compiler.js:507:11
- Tapable.js:195 Compilation.applyPluginsAsyncSeries
[app]/[tapable]/lib/Tapable.js:195:46
- Compilation.js:683
[app]/[webpack]/lib/Compilation.js:683:19
- Tapable.js:202 next
[app]/[tapable]/lib/Tapable.js:202:11
- index.js:126 LastCallWebpackPlugin.process
[app]/[last-call-webpack-plugin]/index.js:126:12
- index.js:197 Compilation.<anonymous>
[app]/[last-call-webpack-plugin]/index.js:197:12
- Tapable.js:206 Compilation.applyPluginsAsyncSeries
[app]/[tapable]/lib/Tapable.js:206:13
- Compilation.js:674
[app]/[webpack]/lib/Compilation.js:674:11
- Tapable.js:202 next
[app]/[tapable]/lib/Tapable.js:202:11
- index.js:126 LastCallWebpackPlugin.process
[app]/[last-call-webpack-plugin]/index.js:126:12
Build failed with errors.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! project@1.0.0 build: `node build/build.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the project@1.0.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /root/.npm/_logs/2020-10-12T11_35_40_116Z-debug.log
现在通过重新安装 vue 解决了这个问题(我在尝试设置它时删除了 index.html 文件......)
现在我得到了(更新了我的 docker-compose、nginx 和 dockerfile 以反映这一点)
```
This page isn’t working localhost didn’t send any data.
ERR_EMPTY_RESPONSE
```
解决方案
通过将 nginx 端口更改为侦听 80 来修复此问题。
Nginx 路径也需要指向app/dist
asnpm run build
使得文件去那里!
推荐阅读
- azure - 如何在我的 Azure 订阅中查找所有预览服务?
- php - 如何在 Woocommerce 中获取和显示 BACS 帐户详细信息
- python - 如何在 Python 上创建块矩阵?
- arrays - 如何创建具有教义关系、joincolumn 和 ManyToOne 的数组?
- php - 如何用我的徽标替换网站标题?
- swift - SWIFT - 从 JSON 中获取值并通过导航控制器
- docker - 在 docker 镜像中安装 sdkman
- wxpython - wxpython:当 Shift 键按下时,为什么我不能签入 wx.CheckListBox?
- samba - jcifs 无法解析 DFS url
- c# - 如何在 HierarchicalDataTemplate 内的绑定中清除 TextBox 文本属性