在Azure上部署MEAN + Webpack [英] Deploy MEAN+Webpack on Azure

问题描述

如何部署MEAN STACK + WEBPAC应用程序?

How do I deploy a MEAN STACK+WEBPAC application?

• 我有一个MEAN Stack + Webpac应用程序和nodejs服务器， 提供其余的api
• 我使用webpack开发服务器运行Angular应用程序
• 构建webpack应用程序后，我有了build.js文件.

• I have a MEAN Stack + Webpac application and nodejs server which provides the rest api
• I run the angular application using webpack dev server
• after building the webpack application,I have the build.js file.

如何从nodejs应用程序引用构建文件?通常，在requirejs中，我会使用html脚本标记， 这样

How do I reference the build file from the nodejs application? Normally,with requirejs, I would use the html script tag, this way

<script src="build.js" /> 

我了解这不是webpac的方式，

I understand this is not the webpac way,

推荐答案

通常来说，我们可以利用

Generally speaking, we can leverage Custom Deployment Script to install the nodejs modules and run custom scripts during the Azure Deployment task, to build your webpack application on Azure Web Apps.

请尝试以下步骤:

1. 通过azure-cli命令azure site deploymentscript --node --sitePath nodejs
创建文件.deployment和deploy.cmd
2. 运行npm命令npm install --save webapck将webpack安装到本地应用程序的目录中.
3. 在package.json文件中定义一个自定义npm脚本以运行webpack命令，并在以后调用部署任务: "scripts": { "webpack":"node_modules/.bin/webpack" },
4. 修改deply.cmd文件，添加一个进程以运行我们定义的npm脚本.在原始文件中，您可以找到类似的脚本来安装node.js模块: :: 3. Install npm packages IF EXIST "%DEPLOYMENT_TARGET%\package.json" ( pushd "%DEPLOYMENT_TARGET%" call :ExecuteCmd !NPM_CMD! install --production IF !ERRORLEVEL! NEQ 0 goto error popd )
   我们可以在其下定义自定义脚本: :: 4. webpack IF EXIST "%DEPLOYMENT_TARGET%\webpack.config.js" ( pushd "%DEPLOYMENT_TARGET%" call :ExecuteCmd !NPM_CMD! run webpack IF !ERRORLEVEL! NEQ 0 goto error popd )
5. 通过Git将Webpack应用程序部署到Azure Web App.

1. Create a file .deployment and deploy.cmd by azure-cli command azure site deploymentscript --node --sitePath nodejs
2. Run npm command npm install --save webapck to install webpack into your local application's directory.
3. define a custom npm script in package.json file to run webpack command and let the deployment task call later: "scripts": { "webpack":"node_modules/.bin/webpack" },
4. Modify the deply.cmd file, add a process to run the npm script we defined. In the original file, you can find the similar script to install the node.js modules: :: 3. Install npm packages IF EXIST "%DEPLOYMENT_TARGET%\package.json" ( pushd "%DEPLOYMENT_TARGET%" call :ExecuteCmd !NPM_CMD! install --production IF !ERRORLEVEL! NEQ 0 goto error popd )
   we can define the custom script under it: :: 4. webpack IF EXIST "%DEPLOYMENT_TARGET%\webpack.config.js" ( pushd "%DEPLOYMENT_TARGET%" call :ExecuteCmd !NPM_CMD! run webpack IF !ERRORLEVEL! NEQ 0 goto error popd )
5. deploy your webpack application to Azure Web App via Git.

这是我在FYI Github上的测试 webpack应用存储库.

Here is my test webpack app repository on Github, FYI.

这篇关于在Azure上部署MEAN + Webpack的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！