This is my first time using Docker so apologies if this drives you mad when reading this.
I'm currently attempting to dockerise my Vue application with Nginx and a dev container (Neither works at the moment)
I have been going endlessly around tutorials but keep going round in circles as my folder structure is not the same so I keep getting this OSError: [Errno 22] Invalid argument: '\\?\D:\GitHub\RepoName\website\node_modules\.bin\acorn' error
The structure of my environment is currently (And cannot be changed!)
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-Compose
website:
container_name: tutorial
image: nginx:1.17
build:
context: ./website
volumes:
- ./website:/app
- ./app/node_modules
ports:
- "8080:80"
As you can see when building it calls the Dockerfile in ./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/[email protected] -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;"]
My Nginx conf if required (Copied from VueJS Docker set up)
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;
}
}
Errors:
OSError: [Errno 22] Invalid argument: '\\?\D:\GitHub\RepoName\website\node_modules\.bin\acorn'
During handling of the above exception, another exception occurred:
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
Update
Fixed Node Issue (I think) by adding it to .dockerignore
Now getting:
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! [email protected] build: `node build/build.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] 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
Fixed that issue now, now onto the next one...
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! [email protected] build: `node build/build.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] 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
Fixed that issue now by pretty much re-installing vue (I deleted the index.html file when trying to get it set up...)
Now I'm getting (Updated my docker-compose, nginx and dockerfile to reflect this)
```
This page isn’t working localhost didn’t send any data.
ERR_EMPTY_RESPONSE
```
