logo标签列表

如何将React Webpack web应用程序部署到Azure App Service？

reactjswebpackazure-web-app-service
4
我的Azure Web应用从Dropbox部署不起作用。
我有一个运行的App服务。我正在尝试部署我的React Webpack应用程序。我已经尝试从我的Bitbucket存储库部署，但是整个项目加载到D：\ home \ site \ wwwroot中，因为Kudu显然认为它是一个node.js应用程序。根据我所读到的，Kudu会对任何具有package.json文件的git部署执行此操作。因此，我尝试从Dropbox部署。我将我的应用程序源正确设置为我的Dropbox / Apps / Azure /目录，然后单击同步。我得到了以下结果：
标题 提交同步请求 说明 正在更新Web应用程序的存储库。 状态 信息性 时间戳 2016年11月23日星期三08:44:09 GMT-0500（东部标准时间） UTC时间戳 2016年11月23日星期三13:44:09 GMT 相关ID 447bf0d0-a533-49dd-898a-57b5be6b5738 完成百分比 100
但是，D：\ home \ site \ wwwroot中的位仍显示来自旧git repo部署的代码。在我的Dropbox页面上，我有要部署的位，即Webpack构建运行后的构建文件夹中的位。它们在根目录下有index.html，因此如果只复制到Azure，则预计会正确提供它。
我对这整个Azure的事情很陌生，有人能帮忙吗？
编辑以下更多信息。
明确一点，我没有部署任何代码，例如包含在wwwroot文件夹中的app.js / server.js。我只复制了Webpack构建运行的结果到指定为源的Dropbox文件夹中的位。该Dropbox文件夹如下：
asset-manifest.json
favicon.ico
index.html
splash.css
static
    css
        main.63e4d058.css
        main.63e4d058.css.map
    js
        main.68797484.js
        main.68797484.js.map
    media
        dell-300-426.b435b6bd.png
        duck.1d942aad.svg
        example1.9443ef49.png
        icon_question.3672f035.png
        ipad-montecarlo-demo.2d964854.png
        moneyplan-imac-300-552-new.8814ce0f.png
web.config

index.html文件中有一个脚本标签，其中的代码指向main.68797484.js文件，这是捆绑的应用程序代码。

但在Azure部署选项中，点击同步后，结果显示“未找到部署”，即使有一个通知“Web应用程序的存储库正在更新”。

2个回答
4
3
根据我的经验，如果app.js/server.js包含在wwwroot文件夹中，则Kudu将认为它是一个node.js应用程序并生成web.config。因此，如果您的应用程序不是node.js应用程序，则wwwroot文件夹不应包括app.js或server.js。
供您参考，我编写了React＆Webpack hello world项目，并成功部署到Azure。以下是具体步骤，请尝试一下:
  1. 将您的项目放入类似于Bitbucket的GitHub存储库中。它们都提供很好的Git服务，这里您可以使用Bitbuket。

  2. 在Azure门户中的您的应用程序菜单中，单击APP DEPLOYMENT>Deployment options。单击选择源，然后选择部署源。 enter image description here

  3. 在Deployment source选项卡中，选择要从中部署项目和分支。完成后，单击OK。 enter image description here

  4. 在Azure门户中，单击APP DEPLOYMENT>Deployment options。然后在选项卡中单击Sync。enter image description here
  5. 按以下方式设置您的入口HTML文件：Default documentsenter image description here
  6. 最终，浏览您的网站，您将看到类似于此enter image description here
谢谢Aaron，但是你的例子并不符合我的情况。请看我对问题的编辑。 - MartinDuo
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接