asp.net+webapi+vuejs,asp.net websocket,asp.net web开发,asp.net web文件浏览器,asp.net web改字体大小,asp.net webform框架,asp.net core 2.0,asp.net mvc,asp.net网站视频教程,asp.net接口,asp.net动态网站_爱问通
实际上 vue.js 的组件语法参考了该规范。例如 vue 组件实现了 slot api 与 is 特性。但是,有几个关键的不同:
web 组件规范仍然远未完成,并且没有浏览器.........
第2章 全局api 01 vue.partial 6分钟
02 vue.extend 10分钟
03 vue.... 很不错的课程,vue.js比angularjs轻便,学完vue再学angular应该就会省事很多了~.........
智能社:javascript之vue.js课程 5
课时数6课时 ... 5、 simple、webpack、webpack-simple、 browserify...(教学总裁),精通java、php、.net、cc++、系统.........
vue.js开发实践_计算机软件及应用_it计算机_专业资料。vue.js的实践应用 ... var view = new vue({ el: #container } el 根据官方 api 的介绍.........
它基于 node.js 4) webpack 广泛的应用在其他的 js 项目构建中 5) 把 vue 组件写成一个一个单独的文件是个绝妙的主意,但是这些文件怎么调用,怎么组合在 一.........
vue.js 语法整理 vuejs0 文档攻略:http:larabas......
angularjs 通过 asp.net web api 认证登录 angularjs 利用 asp.net mvc 提供的 asp.net identity, membership 实现居于数据库的用户名 密码的认证登录 环境 vs.........
结合vue js 的前端压缩图片方案在移动 web 蓬勃发展的今天,有太多太多的应用需要让用户在移动 web 上传图片文件了。在用户上传图片时,图片被提交到后台之前, 就.........
除此之外,vue-resource的请求 api是按照rest风格设计的,它提供了7种请求api: ...vue.http.options.emulatehttp = emulatejson 的作用 如果 web 服务器.........
课课家教育-使用jquery,vuejs开发一款小的拼图游戏视频教程_计算机软件及应用_it计算机_专业资料。课程目标:css背景size,position的使用,vuejs,jquery的使用。拼图.........
概述 概述 vue.js(读音 vju?, 类似于 view)是一个构建数据驱动的 web 界面的库。vue.js 的目标是通过尽可能简单的 api 实现响应的数据绑定和组合的视图.........
另一方面, vue 完全有能力驱动采用单文件组件和 vue 生态系统支持 的库开发的复杂单页应用。 vue.js 的目标是通过尽可能简单的 api 实现响应的数据绑定和组合的.........
(416 * 258 + 339 * 300) = 116 二、vuejs 介绍......
学习目标 使用webpack结合vue-cli、vue-route创建前端自动......
讲解最新版本的vue
适用人群 前端工程师
学习目标 使用vue0搭建前端页面 ...第2章 全局api01 自定义指令 19分钟
02 vue.extend 6分钟
03 vue.set(.........
vuejsvue https:vuejs.orgv2api .... |-- build
项目构建(webpack)相关代码 | | | | | | | | |--.........
vuex 0 源码分析(上)既然 vue.js 0 已经正式发布了,我们也要紧跟步伐,...自上而下的给代码加注释,我更倾向于是从 vuex 提供的 api 和我们的使用方法.........
apidocjs 在线文档工具这是一个跨平台的 api 文档生成工具,通过 nodejs 管理(...生成效果 3、microsoft.aspnet.webapi.helppage 插件这是一个开源插件,支持通过.........
更多的内容在 html5 新增的 js api 这块。比如...尽管 grunt 已经没落,眼看未来是 webpack 的天下。...最新也是目前最火的 vuejs 你可以得开始了解,它.........
vue.js 是用于构建交互式的 web 界面的库。它提供了 mvvm 数据绑定和一个可组合 的组件系统,具有简单、灵活的 api。从技术上讲, vue.js 集中在 mvvm 模式上.........
■ 网友在搜17被浏览4130分享邀请回答4添加评论分享收藏感谢收起匿名用户不能发表回复！|
每天回帖即可获得10分可用分！小技巧：
你还可以输入10000个字符
(Ctrl+Enter)
请遵守CSDN，不得违反国家法律法规。
转载文章请注明出自“CSDN（www.csdn.net）”。如是商业用途请联系原作者。使用 Vue.js 和 Bluemix 创建模块化的单页应用程序，第 2 部分：将应用程序部署到云中
在这个由 2 部分组成的教程的
中，您使用了 Vue.js 框架（结合 NPM、webpack 和 Foundation 作为支持性工具）来构建
recruiteranking 应用程序的 UI。您通过 webpack
的开发服务器测试了这个静态前端应用程序。对于后端，您拥有一个从命令行运行的独立 Java™ 应用程序。前端和后端通过一个在
webpack 开发服务器中设计的简单代理进行交互，因此对 /api/ 的任何请求都会转发到后端端口。完成本地测试后，就可以将 recruiteranking 应用程序部署到 IBM® Bluemix®
云中。您可以通过两种方式部署应用程序。一种是将前端应用程序部署到 Web 服务器（比如 Apache 或 NGINX），将 API
请求转发到到一个独立的后端：替代方法是将前端集成到后端中，以便后端服务器既可以提供静态资产，也可处理 API 请求：两种部署方法各有优势，所以我将分别介绍每种方法。第一种方法的优势是，将静态文件工作卸载到一个专门处理该工作的专用服务器。（而且如果后端由第三方托管，也就是说，您与一个您无法控制的远程
API 进行交互，那么这是唯一的选项。）单一包方法很不错，因为它会让部署保持简单，避免通过网络发送 API 请求。部署您的应用程序需要做的准备工作来自第 1 部分的前端和后端文件。（如果您没有这些文件，请单击本节末尾处的获取代码按钮。）一个 IBM ID 和一个 Bluemix 帐户（注册您的，如果您已经有一个帐户，请 ）。。这个 “CLI 到云” 的托管接口为与服务器交互的 “FTP/SSH 到云”
风格提供了一种不错的替代方案。您使用 Cloud Foundry 客户端将更改推送到云。（安装客户端后，可从命令行运行
cf 来显示 Cloud Foundry 帮助信息。）选项 1：部署一个
NGINX 代理和独立 Java 后端第一种方法让我有机会介绍两种很少记录但很有用的部署战略。将一个静态 Web 应用程序推送到 NGINX 主机中，然后部署一个监听连接的独立 Java
应用程序（打包为可执行的 JAR）。第 1 步.
找到用于 NGINX 的 buildbackCloud Foundry 使用 buildpack 定义和实现面向服务的部署。buildpack
是一个包，它知道如何获取客户端系统（您的系统）上的应用程序，并将其传输到目标云中，在该环境中展开它，然后让它正常运行。Bluemix 拥有的内置 buildpack 在不断增多，但是，如果您寻找的配置不是内置的，那么可以从社区开发的大量 buildpack
中进行选择。您只需向您用于将应用程序推送上线的命令添加一个额外的参数。对于前端应用程序，您想要一个强大的、专用的 Web 服务器来提供资产。在网络上快速搜索
static cloud foundry buildpack 就会找到 GitHub 上的 。该项目的信息丰富的自述文件值得花时间读一下。请注意，该 buildpack 使用
NGINX 来提供资产；这样做很好 — NGINX 是一个高度可配置且成熟的高性能 Web 服务器。该 buildpack 负责将 NGINX
下载并安装到云中，您无需执行该任务。在以后实现构建脚本，并将它合并到持续集成中时（这些步骤不属于本教程的介绍范畴），该 buildpack
还会让您省去一些工作。第 2 步.
设置一个生产构建系统您的项目目前只有一种开发部署，所以您需要一种部署生产资产的方法。打开第 1 部分的 package.json 文件并上传 scripts 条目，以查看类似下方的代码："scripts": {
"server": "webpack-dev-server",
"prod-win": "SET NODE_ENV=production & webpack -p",
"prod-nix": "NODE_ENV=production webpack -p"
}请注意，您添加了两个目标：prod-win 和 prod-nix。这两个目标都支持基于
UNIX® 和基于 Windows® 的系统之间细微的环境变量差异。在每个目标中，都会将
NODE_ENV 环境 var 设置为
production，以便依赖项可执行它们所需的优化。然后，运行带 -p 标志的
webpack 命令。从项目根目录运行 npm run-script prod-win 或
npm run-script prod-nix，具体情况取决于您的环境。片刻之后，您完成的项目就已构建并准备好。因为您没有明确地将输出文件路由到某个特别的地方，所以 bundle.js 文件会放入根目录中。如果具有更复杂的构建要求，可以通过调节
webpack.config.js output 选项将此文件发送到您想要输出的位置。就现在而言，会将
bundle.js 和 index.html 都保留在根目录中。第 3 步.
推送到 Bluemix留在根目录中。如果尚未登录 Bluemix，请运行此命令序列（为斜体部分提供您自己的信息）：cf api https://api.ng.bluemix.netcf login -u user_name -o org_name -s space_name现在将您的应用程序推送到云中，在指定的地方提供您的首字母：cf push your initials-vue-demo -m 64M -b /cloudfoundry/staticfile-buildpack.gitBluemix 使用 your initials-vue-demo 作为您的应用程序的名称，它必须在整个
Bluemix 中是唯一的。请注意，您将 -m 内存标志设置为 64，这是 NGINX 需要的全部内存。稍等片刻，在看到一些日志输出后，您会看到一条 OK 消息。您现在可以在 http://your
initials-vue-demo.mybluemix.net/ 上看到该应用程序在正常运行。请注意，该页面中没有填入数据，因为后端服务器不存在。您需要告诉 NGINX 来代理发送给后端的 API 请求 —
但是首先，您必须部署后端服务。第 4 步.
部署独立服务器 JAR后端服务器是一个通过 Maven JAR 插件打包的标准的可执行 JAR。这个完整的 JAR 包括依赖项，（通过 Spark
Framework）运行一个嵌入式 Jetty 服务器。转到您保存该 JAR 的目录并运行此命令（它使用了内置的 Java buildpack）：cf push your-initials-rr-backend -p rr-backend-1.0.jar -b java_buildpack您的后端现在已上线（可转到
http://your-initials-rr-backend.mybluemix.net/api/test/ and
seeing TEST OK 来验证此操作）。现在，您需要配置运行前端来代理发送给后端的 /api/* 请求的 NGINX 服务器。Bluemix 中的 NGINX
配置有点繁琐，因为它是一个托管系统。对 nginx.conf 配置文件使用以下内容（与标准部署所使用的默认 nginx.conf
相同，但增加了一项）：worker_processes 1;
error_log /home/vcap/app/nginx/logs/error.
events { worker_connections 1024; }
log_format cloudfoundry '$http_x_forwarded_for - $http_referer - [$time_local] "$request"
$status $body_bytes_sent';
access_log /home/vcap/app/nginx/logs/access.
default_type application/octet-
include mime.
gzip_disable "msie6";
gzip_comp_level 6;
gzip_min_length 1100;
gzip_buffers 16 8k;
gzip_types text/plain text/css text/js text/xml text/javascript application/javascript
application/x-javascript application/json application/xml application/xml+
keepalive_timeout 30;
port_in_ # Ensure that redirects don't include the internal container PORT - 63575
listen &%= ENV["PORT"] %& ;
location / {
root /home/vcap/app/
index index.html index.htm Default.
# Add this proxy config
location /api {
proxy_pass
http://mt-rr-backend-1.mybluemix.net:80/
}在使用 # Add this proxy config 注释掉的那一部分中，可以看到一条简单的
proxy_pass 配置。任何发送到该 URI 路径的请求都会转发到后端服务器。将该 URI
替换为您的服务器的位置（在将后端部署到 Bluemix 时使用的位置），如果您愿意的话，也可以使用我的后端应用的位置
(http://mt-rr-backend-1.mybluemix.net/api/test/)。现在，当您打开前端应用程序时，就会看到该表格已填充，而且登录功能与开发版本中一样有效。选项 2：作为
WAR 文件的一部分来部署静态资产“您甚至不需要指定构建文件，因为 WAR 格式非常标准，以至于 Bluemix 可以识别它并将它部署到 Java
Web 容器中。”一旦知道如何做之后，分两个单独部分来部署应用程序就会非常容易。现在您将作为后端服务器的一部分来部署前端资产。为此，您需要深入服务器应用程序的内部，看看它的内部结构。我之前曾经提到过，该应用程序会使用 Spark Framework 来执行简单的 REST 处理。所以您可以使用 Spark 的静态资产处理，将
HTML 和 JavaScript 放在公共资产目录中，并让 Spark 提供它们。然后，像选项 1 中一样部署（作为独立的
JAR，但在本例中同时包含客户端和服务器代码）。尽管该方法有效，但没有什么新意。所以我将介绍如何部署一个同时包含前端和后端代码的 WAR
文件。您从第 1 部分下载的 rr-backend-war 文件是 Spark 应用程序的 WAR 版本。我将静态资产（index.html 和
bundle.js）复制到 /resource/public 目录中，我在 Spark 中将该目录设置为公共目录。我在 web.xml 中配置了
Spark 过滤器，在 Maven pom.xml 中配置了 WAR 打包设置。要生成该 WAR 文件，可在项目的根目录中运行 mvn package。然后，Maven 将一个 .war
文件放在 /target 中。要部署该 .war 文件，可以更改到 /target 目录并运行以下命令：cf push your-initials-rr-war -p rr-backend-war-1.0-SNAPSHOT.war可以注意到，您甚至不需要指定构建文件。WAR 格式非常标准，因此 Bluemix 可以识别它并将它部署到 Java Web
容器中（不用奇怪，该容器是一个 IBM WebSphere® 实例）。结束语您了解了部署第 1 部分中的 Vue.js 应用程序的两种不同方法。第 1 部分介绍的堆栈（以 Vue.js
为中心）为您提供了强大功能，同时实现了最大限度的简化。Bluemix/Cloud Foundry CLI
组合产品使得将应用程序从您的硬盘迁移到云中变得非常容易。第 1 和 2 部分相结合，为您提供了开发和部署 Web
应用程序的更先进的方法。我希望这些教程中的想法会在您构建应用程序的过程中帮助您不断获得灵感。
添加或订阅评论，请先或。
有新评论时提醒我
static.content.url=/developerworks/js/artrating/SITE_ID=10Zone=Web development, Cloud computingArticleID=1028135ArticleTitle=使用 Vue.js 和 Bluemix 创建模块化的单页应用程序，第 2 部分：将应用程序部署到云中publish-date=}