1. 前言 

最近学习ABP架构 搭建ASP.NET Core with Angular遇到了些问题,折腾了一个礼拜最终在今天解决了,想想这个过程的痛苦就想利用博客记录下来。其实一直想写博客,但因为  时间忙和惰性一直没有写。之前也遇到些问题,费了很大劲最后解决了,但过了好久又遇到类似问题,但想不起来之前怎么解决了,又一阵各种百度尝试解决了,所以写博客的好处就是记录下来。

2. 下载ASP.NET Core 2.x + Angular代码

先在ABP官网(https://aspnetboilerplate.com)下载了ASP.NET Core 2.x + Angular最新版

3. 后台编译运行

下载后按官方说明后台编译运行一切正常 

Introduction

The easiest way of starting a new project using ABP with ASP.NET Core with Angular is to create a template on templates page. Remember to check "Include module zero". After creating and downloading your project, follow below steps to run your application.

ASP.NET Core Application

    • Open your solution on Visual Studio 2017+ and build the solution.
    • Select the 'Web.Host' project as startup project.
    • Open Package Manager Console and run Update-Database command to create your database (ensure that Default project is selected as .EntityFrameworkCore in the Package Manager Console window).
    • Run the application. It will show swagger-ui if it is successfull:

4. angular项目运行 遇到错误

当跑angular项目的时候,一直跑不起来报错,开始以为是我电脑环境安装问题,一直卸载重装,什么node、typescript、angular/cli 重装了个遍,npm install安装是成功的,主要卡在npm start,到最后 一直报Error webpack的错,查找了很多资料,我想应该还是安装包的版本不对的问题。最后又找到官方文档,又按官方文档做了一遍还是不行,并对环境安装包的版本都核对了一遍是对的,但在文档里看到yarn的说明,于是点进去了解了一下

5. 问题诊断与解决

在错误信息里也出现yarn的不支持说明(中文官网:https://yarnpkg.com/zh-Hans/),肯定给这个yarn有关,于是就下载安装,但安装后命令一直无效,最后干脆重启电脑,电脑重启后命令可以用了,窃喜,于是又删除包进行npm install,再进行npm start,还是报错。于是又详细了解了一下yarn的说明和使用,找到了一篇说yarn和npm的区别的文章(http://web.jobbole.com/88459/)

安装的时候无法保证速度/一致性

安全问题,因为 npm 安装时允许运行代码

这是给npm对比重要的两点,这个一致性很重要,我怀疑就是我的环境安装包和作者的环境安装包不一致导致的,于是我查看了yarn的相关使用和语法,我先尝试了npm install,然后再yarn install,npm start发现还是报错,错误信息不一样了,最后又删除了node_modules目录,重新yarn install,npm start,运行成功了!!

6. 总结

通过这个问题解决的过程,让我了解到了yarn,就是如官网(https://yarnpkg.com/zh-Hans/)上说明的一样 快速、可靠、安全的依赖管理。可靠使你在不同的电脑安装依赖包的环境一致,我正是因为和作者安装包的依赖项环境不一致导致一直运行不成功,环境不一致往往是因为一些包的升级后npm安装包不精准导致的问题。

同时,遇到问题要坚持去解决、遇到新技术要先去了解,还要养成写博客的习惯,遇到问题记录下来。

学习ABP ASP.NET Core with Angular 环境问题的更多相关文章

  1. 从零开始一个个人博客 by asp.net core and angular(一)

    这是一个个人叙述自己建设博客的帖子,既然是第一篇那肯定是不牵扯代码了,主要讲一下大体的东西,微软最新的web框架应该就数asp.net core 3.1了这是一个长期支持版,而且是跨平台又开源版本,所 ...

  2. 52ABP模板 ASP.Net Core 与 Angular的开源实例项目

    阅读文本大概需要 5 分钟. 开始之前 自从上一篇文章".NET:持续进化的统一开发平台"发布后,已经有三个月的时间没有写过文章了. 这段时间,做了两场线下活动,一场在上海,一场在 ...

  3. 运行ABP(asp.net core 3.X+Vue)提示'OFFSET' 附近有语法错误。 在 FETCH 语句中选项 NEXT 的用法无效。

    创建ASP.NET Boilerplate,还原数据库和启动客户端 这里就略过,具体参考 ABP框架(asp.net core 2.X+Vue)模板项目学习之路(一) ASP.NET Boilerpl ...

  4. 主厨(第4部分)- ASP. netNET Core和Angular 2 CRUD SPA

    下载source - 79.7 KB 介绍 在Master Chef(第1部分)和Master Chef(第2部分)中,我介绍了如何使用ASP.Net Core和Angular JS.在Master ...

  5. ASP.NET Core和Angular 2双剑合璧

    (此文章同时发表在本人微信公众号"dotNET每日精华文章",欢迎右边二维码来关注.) 题记:两个还没有正式发布的东西一起用,是什么效果? 效果当然会很好了(我猜的),那么如何在A ...

  6. 从零开始一个个人博客 by asp.net core and angular(三)

    这是第三篇了,第一篇只是介绍,第二篇介绍了api项目的运行和启动,如果api项目没什么问题了,调试都正常了,那基本上就没什么事了,由于这一篇是讲前端项目的,所以需要运行angular项目了,由于前端项 ...

  7. .Net Core 学习 (1) - ASP.NET Core 总览

    什么是ASP.NET 1.0 开源 - GitHub 跨平台 - 支持Windows, Mac, Linux 从底层进行了优化 - 使用最小开销的模块化组件 - 给与了开发人员很大的灵活性 为什么要使 ...

  8. 酷学习笔记——ASP.NET Core 简介

    ASP.NET Core 简介 其实就是说酷好,不好好学,不学好,没饭吃. 新词汇:IoT,Internet of Things,网联网,微软物联网英文网站.微软物联网中文网站

  9. (入门整理学习一)Asp.net core

    1.安装.net code SDK,vs Code;vs code c#插件可在软件扩展 (我网盘有)  vs2015上安装教程:http://www.cnblogs.com/wangrudong00 ...

随机推荐

  1. redis数据类型及常用命令介绍(图文实例)

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAhgAAAFLCAYAAACUdvXUAAAgAElEQVR4nO3da1da58L2fT5KfPvc96 ...

  2. tpshop使用自带极光推送

    推送逻辑在common里面的PushLogic.php;在后台网站->商城设置->推送设置,将极光的ID,密码填一下系统会自动加入数据库里面. 在你所需推送的PHP类里面引用这个文件即可. ...

  3. openstack Keystone验证服务集群

    #Keystone验证服务群集 openstack pike 部署 目录汇总 http://www.cnblogs.com/elvi/p/7613861.html ##.Keystone验证服务集群 ...

  4. Scala入门系列(四):Map & Tuple

    Map 创建Map // 创建一个不可变的Map scala> val ages = Map("Leo" -> 30, "Sparks" -> ...

  5. python学习之路day2

    模块学习: 标准库: os: 第三方库:

  6. Hibernate框架进阶(上篇)

    导读 前面一片文章介绍了Hibernate框架的入门,主要是讲解Hibernate的环境搭建和简单测试,有兴趣的童鞋出门左转.本文在入门的基础上进行Hibernate的进阶讲解,分为上中下三篇,本篇为 ...

  7. spring boot + mybatis + hikaricp + swagger2 + jasypt

    好久没写博客了记录下写过的东西,别到时候又忘了 文章前提:前面开发项目的时候数据池一直用的阿里的druid,这个数据池吧也不能说它不好,为什么现在想改成hikaricp数据池呢,完全是实用项目需要.d ...

  8. request和response中文乱码问题后台处理办法

    request接收参数的中文乱码的处理: GET: 方法一:使用String的构造方法: new String(request.getParameter("传过来的name").g ...

  9. 如何在你的blog中添加炫酷的飘雪动画效果

    将下面的代码复制到你的设置栏下页眉html代码框中即可 <script> (function($){$.fn.snow=function(options){,maxSize:,newOn: ...

  10. HVR又一次load的时候须要将schedule suspend掉

    今天在进行HVR的又一次load的时候.报错了: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fi ...