具体的にはReact/Redux(または他のNode.jsが必要)テンプレートを使用して、新しいASP.NET Core MVCアプリを作成するときに使用する正しいDockerイメージは何ですか?特定のイメージではない場合、ASP.NET Core MVCによってサポートされるNode.jsアプリのDockerfileでどのコマンドまたはプロセスに従う必要がありますか?
バッキングMVCサイトの実行以外には、SDKバージョンのフレームワークは必要ありません。
dotnet new reactredux
ランタイムイメージにはNode.jsがインストールされていないため、コンテナーを実行しようとするとエラーが発生します。
Dockerfile:
FROM Microsoft/aspnetcore:latest
ARG source=./bin/Debug/netcoreapp2.0/publish/
WORKDIR /app
COPY $source .
EXPOSE 80
ENTRYPOINT ["dotnet", "Project.dll"]
エラー:
Unhandled Exception: System.AggregateException: One or more errors occurred. (Failed to start Node process. To resolve this:.
[1] Ensure that Node.js is installed and can be found in one of the PATH directories.
Current PATH enviroment variable is: /usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin
Make sure the Node executable is in one of those directories, or update your PATH.
私が取り組んでいるプロジェクトは、ASP.NET MVC for .NET Standard 1.1(スタンドアロン)から新しい.NET Standard 2.0 React/Reduxプロジェクトにアップグレードされています。
問題は、Dockerfileのベースイメージ(Microsoft/aspnetcore:latest)にノードがインストールされていないことです。
そのため、プロジェクトを実行できるようにノードをインストールする必要があります。これは私が思いついたdockerfileです:
FROM Microsoft/aspnetcore:2.0
ARG source
EXPOSE 80 5102
ENV ASPNETCORE_URLS http://*:80
RUN apt-get -qq update && apt-get -qqy --no-install-recommends install wget gnupg \
git \
unzip
RUN curl -sL https://deb.nodesource.com/setup_6.x | bash -
RUN apt-get install -y nodejs
WORKDIR /app
COPY ${source:-obj/Docker/publish} .
ENTRYPOINT ["dotnet", "Project.dll"]
Dockerfileの5行目で、apt-getを更新するコマンドを実行していることに注目してください。そして、8-9行目でノードがDockerイメージにインストールされます
それでも問題があり、webpackからのホットモジュールの交換は機能しません。完全な更新も機能しません。私はまだそれを見ています。
UPDATE:したがって、ホットモジュール交換の問題を調べたところ、 windowsのdockerの制限 のように見えます。
回避策は、決められた時間に変更をポーリングするようブラウザに指示できるようにwebpackを設定することです。 設定方法についてはこのリンクをご覧ください
UPDATE:もう少し調べてみると、Microsoftにはプロジェクトのビルドに使用できるイメージがあることがわかりました。Microsoft/ aspnetcore-buildと呼ばれます。 。このイメージには、構築に必要なすべての依存関係が含まれています(nodejsを含む)。
そのため、最後に、Dockerfileを(Microsoft/aspnetcore:2.0をベースイメージとして)そのままにして、前に述べたビルドイメージを参照する開発用の新しいDockerfileを作成しました。 docker composeを使用して、環境に応じてDockerfileを切り替えます。
このアプローチは、イメージを実稼働環境にデプロイするときに、すべてのJavaScriptコードを準備する必要があるため(つまり、angular 2、reactなど)のスパアプリケーションの場合) nodejsに依存しないようにして、サイズを小さくします。
上記の@Danielsの回答に基づいて、DockerでVisual Studio 2017 v15.4およびASP.NET Core 2.0を実行している場合、SPAアプリケーションの生産および開発の正しい動作を可能にするために必要な変更を以下に示します(私の場合、Angularを使用しています) ):
元のコピーである新しいDockerfileをプロジェクトに追加します。それをDockerfile.Developmentと呼びましょう。次のように変更します。
FROM Microsoft/aspnetcore:2.0
ARG source
# BEGIN MODIFICATION - Node is needed for development (but not production)
RUN curl -sL https://deb.nodesource.com/setup_6.x | bash -
RUN apt-get install --assume-yes nodejs
# END MODIFICATION
WORKDIR /app
EXPOSE 80
COPY ${source:-obj/Docker/publish} .
ENTRYPOINT ["dotnet", "MyService.dll"]
ソリューションでdocker-compose.override.ymlファイルを変更して、開発中にこの新しいdockerfileを使用します。次のようになります。
version: '3'
services:
myservice:
environment:
- ASPNETCORE_ENVIRONMENT=Development
ports:
- "80"
build:
dockerfile: Dockerfile.Development
プロジェクトのwebpack.config.jsファイルを変更して、次のように変更を監視できるようにします。
const clientBundleConfig = merge(sharedConfig, {
entry: { 'main-client': './ClientApp/boot.browser.ts' },
output: { path: path.join(__dirname, clientBundleOutputDir) },
// BEGIN MODIFICATION
watch: isDevBuild,
watchOptions: {
poll: isDevBuild ? 1000 : false
},
// END MODIFICATION
plugins: [
new webpack.DllReferencePlugin({
context: __dirname,
manifest: require('./wwwroot/dist/vendor-manifest.json')
})
].concat(isDevBuild ? [
node
バイナリだけを画像に追加する必要がある場合は、Microsoft/aspnetcore-build
dockerfileは以下を行います:
ENV NODE_VERSION 6.10.3
RUN set -ex \
&& for key in \
9554F04D7259F04124DE6B476D5A82AC7E37093B \
94AE36675C464D64BAFA68DD7434390BDBE9B9C5 \
0034A06D9D9B0064CE8ADF6BF1747F4AD2306D93 \
FD3A5288F042B6850C66B31F09FE44734EB7990E \
71DCFD284A79C3B38668286BC97EC7A07EDE3FC1 \
DD8F2338BAE7501E3DD5AC78C273792F7D83545D \
B9AE9905FFD7803F25714661B63B535A4C206CA9 \
C4F0DFFF4E8C1A8236409D08E73BC641CC11F4C8 \
; do \
gpg --keyserver pgp.mit.edu --recv-keys "$key" || \
gpg --keyserver ha.pool.sks-keyservers.net --recv-keys "$key" || \
gpg --keyserver keyserver.pgp.com --recv-keys "$key" ; \
done
# set up node
RUN buildDeps='xz-utils' \
&& set -x \
&& apt-get update && apt-get install -y $buildDeps --no-install-recommends \
&& rm -rf /var/lib/apt/lists/* \
&& curl -SLO "https://nodejs.org/dist/v$NODE_VERSION/node-v$NODE_VERSION-linux-x64.tar.xz" \
&& curl -SLO "https://nodejs.org/dist/v$NODE_VERSION/SHASUMS256.txt.asc" \
&& gpg --batch --decrypt --output SHASUMS256.txt SHASUMS256.txt.asc \
&& grep " node-v$NODE_VERSION-linux-x64.tar.xz\$" SHASUMS256.txt | sha256sum -c - \
&& tar -xJf "node-v$NODE_VERSION-linux-x64.tar.xz" -C /usr/local --strip-components=1 \
&& rm "node-v$NODE_VERSION-linux-x64.tar.xz" SHASUMS256.txt.asc SHASUMS256.txt \
&& apt-get purge -y --auto-remove $buildDeps \
&& ln -s /usr/local/bin/node /usr/local/bin/nodejs
これにより、画像に約42 MBが追加されますが、apt-get
。
Nodejsをベースにインストールするだけで、Angularサンプルテンプレートが機能するようになりました。
FROM Microsoft/aspnetcore:2.0 AS base
RUN apt-get update && \
apt-get install -y wget && \
apt-get install -y gnupg2 && \
wget -qO- https://deb.nodesource.com/setup_6.x | bash - && \
apt-get install -y build-essential nodejs
WORKDIR /app
EXPOSE 80
... rest of Dockerfile ...
他のすべて(Webpack Hot swap)はエラーをスローしませんでした。