发生了一个未处理的异常:找不到"/ang-frontend“中的模块"@angular-devkit/build-angular”。使用docker和docker-compose

Question

我在docker-compose中运行angular应用程序时遇到这个错误，但奇怪的是，在docker run中运行时却没有得到这个错误。

docker-compose

Ang-frontend            | 
Ang-frontend            | > Ang-frontend@0.0.0 serve-docker /Ang-frontend
Ang-frontend            | > ng serve  --proxy-config docker-proxy.conf.json --disable-host-check --host 0.0.0.0 --public-host http://localhost:4200
Ang-frontend            | 
Ang-frontend            | An unhandled exception occurred: Could not find module "@angular-devkit/build-angular" from "/Ang-frontend".
Ang-frontend            | Fatal error writing debug log file: ENOENT: no such file or directory, lstat '/tmp'
Ang-frontend            | Error: Could not find module "@angular-devkit/build-angular" from "/Ang-frontend".
Ang-frontend            |     at Object.resolve (/usr/local/nvm/versions/node/v12.14.1/lib/node_modules/@angular/cli/node_modules/@angular-devkit/core/node/resolve.js:154:11)
Ang-frontend            |     at WorkspaceNodeModulesArchitectHost.resolveBuilder (/usr/local/nvm/versions/node/v12.14.1/lib/node_modules/@angular/cli/node_modules/@angular-devkit/architect/node/node-modules-architect-host.js:31:40)
Ang-frontend            |     at ServeCommand.initialize (/usr/local/nvm/versions/node/v12.14.1/lib/node_modules/@angular/cli/models/architect-command.js:71:63)
Ang-frontend            |     at async ServeCommand.validateAndRun (/usr/local/nvm/versions/node/v12.14.1/lib/node_modules/@angular/cli/models/command.js:124:9)
Ang-frontend            |     at async Object.runCommand (/usr/local/nvm/versions/node/v12.14.1/lib/node_modules/@angular/cli/models/command-runner.js:186:24)
Ang-frontend            |     at async default_1 (/usr/local/nvm/versions/node/v12.14.1/lib/node_modules/@angular/cli/lib/cli/index.js:54:31)
Ang-frontend            | npm ERR! code ELIFECYCLE
Ang-frontend            | npm ERR! syscall spawn
Ang-frontend            | npm ERR! file sh
Ang-frontend            | npm ERR! errno ENOENT
Ang-frontend            | npm ERR! Ang-frontend@0.0.0 serve-docker: `ng serve  --proxy-config docker-proxy.conf.json --disable-host-check --host 0.0.0.0 --public-host http://localhost:4200`
Ang-frontend            | npm ERR! spawn ENOENT
Ang-frontend            | npm ERR! 
Ang-frontend            | npm ERR! Failed at the Ang-frontend@0.0.0 serve-docker script.
Ang-frontend            | npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
Ang-frontend            | npm WARN Local package.json exists, but node_modules missing, did you mean to install?
Ang-frontend            | 
Ang-frontend            | npm ERR! A complete log of this run can be found in:
Ang-frontend            | npm ERR!     /root/.npm/_logs/2020-02-02T19_10_50_952Z-debug.log

docker run -p 4200:4200 Ang-frontend

> Ang-frontend@0.0.0 serve-docker /Ang-frontend
> ng serve  --proxy-config docker-proxy.conf.json --disable-host-check --host 0.0.0.0 --public-host http://localhost:4200

WARNING: This is a simple server for use in testing or debugging Angular applications
locally. It hasn't been reviewed for security issues.

Binding this server to an open connection can result in compromising your application or
computer. Using a different host than the one passed to the "--host" flag might result in
websocket connection issues. You might need to use "--disableHostCheck" if that's the
case.
WARNING: Running a server with --disable-host-check is a security risk. See https://medium.com/webpack/webpack-dev-server-middleware-security-issues-1489d950874a for more information.
ℹ ｢wds｣: Project is running at http://localhost:4200/webpack-dev-server/
ℹ ｢wds｣: webpack output is served from /
ℹ ｢wds｣: 404s will fallback to //index.html

chunk {main} main.js, main.js.map (main) 429 kB [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 264 kB [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 6.15 kB [entry] [rendered]
chunk {scripts} scripts.js, scripts.js.map (scripts) 165 kB [entry] [rendered]
chunk {styles} styles.js, styles.js.map (styles) 998 kB [initial] [rendered]
chunk {vendor} vendor.js, vendor.js.map (vendor) 4.83 MB [initial] [rendered]
Date: 2020-02-02T19:09:33.684Z - Hash: 255ef6ce2bc8407e8f48 - Time: 12189ms
** Angular Live Development Server is listening on 0.0.0.0:4200, open your browser on http://localhost:4200/ **
ℹ ｢wdm｣: Compiled successfully.

package.json

{
  "name": "Ang-frontend",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "serve-docker": "ng serve  --proxy-config docker-proxy.conf.json --disable-host-check --host 0.0.0.0 --public-host http://localhost:4200"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~8.2.14",
    "@angular/common": "~8.2.14",
    "@angular/compiler": "~8.2.14",
    "@angular/core": "~8.2.14",
    "@angular/forms": "~8.2.14",
    "@angular/platform-browser": "~8.2.14",
    "@angular/platform-browser-dynamic": "~8.2.14",
    "@angular/router": "~8.2.14",
    "@ngx-translate/core": "^11.0.1",
    "@ngx-translate/http-loader": "^4.0.0",
    "bootstrap": "^4.4.1",
    "jquery": "^3.4.1",
    "rxjs": "~6.4.0",
    "tslib": "^1.10.0",
    "zone.js": "~0.9.1"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.803.23",
    "@angular/cli": "~8.3.23",
    "@angular/compiler-cli": "~8.2.14",
    "@angular/language-service": "~8.2.14",
    "@types/node": "~8.9.4",
    "@types/jasmine": "~3.3.8",
    "@types/jasminewd2": "~2.0.3",
    "codelyzer": "^5.0.0",
    "jasmine-core": "~3.4.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~4.1.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.4.0",
    "protractor": "~5.4.0",
    "ts-node": "~7.0.0",
    "tslint": "~5.15.0",
    "typescript": "~3.5.3"
  }
}

dockerfile

FROM debian:buster-slim

SHELL [ "/bin/bash", "--login", "-c" ]

#RUN rm /bin/sh && ln -s /bin/bash /bin/sh
ENV NVM_DIR=/usr/local/nvm NODE_VERSION=12.14.1 NODE_PATH=$NVM_DIR/v$NODE_VERSION/lib/node_modules PATH=$NVM_DIR/v$NODE_VERSION/bin:$PATH

RUN apt-get update && \
    apt-get install -y --no-install-recommends build-essential software-properties-common ca-certificates apt-transport-https curl && \
    mkdir -p $NVM_DIR && \
    curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.35.1/install.sh | bash && \
    source $NVM_DIR/nvm.sh && \
    nvm install v$NODE_VERSION && \
    nvm alias default v$NODE_VERSION && \
    nvm use default && \
    npm install npm -g && \
    apt-get autoremove && \
    apt-get clean && \
    rm -rf node_modules/ && \
    rm -rf /var/lib/apt/lists/*

#
# Application directory
#
WORKDIR /Ang-frontend

ENV PATH=/Ang-frontend/node_modules/.bin:$PATH
#
# copy contents
#
COPY . .

#
# install package dependencies
#
RUN npm install -g @angular/cli@8.3.23 && \
    npm update && \
    rm -rf /tmp/

EXPOSE 4200

#
# Start the application
#
CMD npm run serve-docker

我对这个问题感到非常困惑。我尝试了npm update --save dev等所有方法，但问题仍然存在。

我在AngluarJs/Node开发方面没有太多经验。如果有人能指出我做错了什么，那就太好了。

谢谢你

Answer 1

我在我的mean stack应用程序中也得到了同样的错误。最后，我终于解决了这个问题。

该问题与docker-compose.yml文件中的卷挂载有关。

version: '3'

services: 
    angular:
        build: angular-client
        container_name: ecommerce-client
        ports:
            - "4200:4200"
        volumes:
            - ./angular-client/:/var/www/app
            - /var/www/app/node_modules/ <-- this should be added

因此，./angular-client/:/var/www/app行将本地angular文件夹挂载到容器的文件夹中。如果我们在本地angular项目中没有node_modules，这意味着在docker-compose up之后，我们的本地angular文件夹将覆盖容器的文件夹。基本上，即使您在容器中运行npm install来安装所有依赖项，最后容器文件夹也会被本地angular文件夹覆盖。你会丢失node_modules包。

要解决此问题，您需要排除node_modules文件夹。添加下面的行就足以将其排除。

- /var/www/app/node_modules/

P.S.：docker-compose.yml文件不读取.dockerignore文件。Dockerfile使用.dockerignore文件。