从头开始学eShopOnContainers——设置WebSPA单页应用程序
一、简介
Web SPA单页应用程序需要一些额外的步骤才能使其工作,因为它需要在生成Docker镜像之前构建JavaScript框架依赖项和JS代码。
二、安装基础环境
1、安装NPM
为了能够使用npm从命令行构建JavaScript依赖项,您需要全局安装npm。由于npm和nodejs捆绑在一起,所在只需要从https://nodejs.org/en/下载推荐版本安装即可。安装完成后可通过“npm -v”查看版本信息,验证是否安装成功。
2、安装Angular CLI
编译Web SPA单页应用程序需要全局安装Angular CLI,使用“npm install -g @angular/cli”命令即可完成安装,安装完成后可通过“ng version”查看版本信息,验证是否安装成功。
3、在VisualStudio中设置npm路径信息
在VisualStudio的菜单“工具”->"选项"设置中,添加nodejs路径,注意必须添加至“VSInstalledExternalTools”前面。
三、使用npm构建WebSPA单页应用程序
1、切换至源代码目录,执行“npm install”安装所有依赖,并重建node-sass。
cd /d D:\TFS2018\eShopOnContainers-dev\src\Web\WebSPA
npm install
npm audit fix
npm rebuild node-sass
2、构建构建WebSPA单页应用程序
npm run build:prod
3、将“docker-compose”设置为默认启动项目,按F5或者点运行。
项目正常启动后,即可正常打开WebSPA单页应用程序网页: http://localhost:5104。
从头开始学eShopOnContainers——设置WebSPA单页应用程序的更多相关文章
- 【ASP.NET MVC 5】第27章 Web API与单页应用程序
注:<精通ASP.NET MVC 3框架>受到了出版社和广大读者的充分肯定,这让本人深感欣慰.目前该书的第4版不日即将出版,现在又已开始第5版的翻译,这里先贴出该书的最后一章译稿,仅供大家 ...
- Web API 2 入门——使用ASP.NET Web API和Angular.js构建单页应用程序(SPA)(谷歌翻译)
在这篇文章中 概观 演习 概要 由网络营 下载网络营训练包 在传统的Web应用程序中,客户机(浏览器)通过请求页面启动与服务器的通信.然后,服务器处理请求,并将页面的HTML发送给客户端.在与页面的后 ...
- require实现单页应用程序(SPA)
写了一个测试代码,用require.js配合它的一个插件text.js实现了最简单的单页应用程序,简单的记录一下,方便以后复习, git地址:https://github.com/lily1010/r ...
- Senna.js – 速度极快的单页应用程序引擎
Senna.js 是一个速度超快的单页应用程序引擎,提供了几个低级别的 API,可以帮助你打造现代化的基于 Web 的应用程序.更重要的是,搜索引擎蜘蛛应该能够索引相同的内容. 通过使用 HTML5 ...
- SPA解释:单页应用程序
单页Web应用(single page web application,SPA),就是只有一张Web页面的应用,是加载单个HTML 页面并在用户与应用程序交互时动态更新该页面的Web应用程序. 单页W ...
- SPA (单页应用程序)
单页Web应用 编辑 单页Web应用(single page web application,SPA),就是只有一张Web页面的应用.单页应用程序 (SPA) 是加载单个HTML 页面并在用户与应用程 ...
- 从头开始学eShopOnContainers——Visual Studio 2017环境配置
一.安装和配置Docker环境 1.安装Docker CE for Windows 从官方网站下载并安装,https://docs.docker.com/docker-for-windows/inst ...
- 从头开始学eShopOnContainers——开发环境要求
一.简介 eShopOnContainers是一个简化版的基于.NET Core和Docker等技术开发的面向微服务架构的参考应用,是一个简化版的在线商城/电子商务应用,其包含基于浏览器的Web应用. ...
- 单页应用 - Token 验证
单页应用 - Token 验证 转:https://juejin.im/post/58da720b570c350058ecd40f 第一次接触单页应用,记录公司项目关于Token验证知识. Token ...
随机推荐
- 【转】JMeter代理录制脚本
JMeter代理录制脚本 使用JMeter代理录制脚本的过程如下: 1.启动JMeter,在测试计划中添加“线程组”. 2.在“线程组”中添加“HTTP请求默认值”,参数设定如下: 3.在“”中添加“ ...
- Scanner 的练习 。。。。依然不懂用法。。。苦恼
package com.b; import java.util.Random; import java.util.Scanner; public class Core { public static ...
- 分布式缓存系统 Memcached 工作线程初始化
Memcached采用典型的Master-Worker模式,其核心思想是:有Master和Worker两类进程(线程)协同工作,Master进程负责接收和分配任务,Worker进程负责处理子任务.当各 ...
- PHP5.3.8连接Sql Server SQLSRV30
PHP5.3连接SQL Server就不能用php_mssql.dll了. 网上下载了好多都不行,因为它的版本是5.2的,不能再PHP5.3中使用. 后来听说微软专门为PHP出了自己的dll. 叫做M ...
- appiumsend_keys很慢的解决方法
desired_caps['unicodeKeyboard']='True' desired_caps['resetKeyboard']='True' 添加这两个项,默认使用appium ...
- Linux 命令初识
Alt+Ctrl+F[1~6]:切换虚拟终端 如果要切换到第 2 号虚拟终端的话,按 Alt+Ctrl+F2 要切换回去的话,按 Alt+Ctrl+F1 #:为 root 用户的系统提示符 $:为普通 ...
- 查询cad库中,所有程序leg引用的点的id,需要预先处理点表和程序表
select f1.pro_id,f1.pro_type, f1.code_fix_point, f1.code_type_fix_point, f1.code_fir,f2.code_icao,nv ...
- Linux的基本指令--目录和文件和文件属性和文件用户组
目录和文件 一 . ls:列出目录的内容,未给出目录名或是文件名时,就显示当前目录的信息. -a 列出隐藏文件,文件中以”.”开头的均为隐藏文件,如:~/.bashrc -l 列出文件的详细信息 ...
- elasticsearch2.x插件之一:marvel(配置)
Marvel是Elastic公司推出的商业监控方案,是用来监控Elasticsearch集群,历史状态的有力工具,便于性能优化以及故障诊断.监控主要分为六个层面,分别是集群层.节点层.索引层.分片层. ...
- C/C++代码覆盖率工具gcov、lcov
gcov是一个可用于C/C++的代码覆盖工具,是gcc的内建工具.下面介绍一下如何利用gcov来收集代码覆盖信息. 想要用gcov收集代码覆盖信息,需要在gcc编译代码的时候加上这2个选项 “-fpr ...