当前位置： 首页 > news >正文

Azure + React + ASP.NET Core 项目笔记一：项目环境搭建（一）

news 文章来源：https://blog.csdn.net/qq_40044912/article/details/132710712 2024/11/30 7:52:26

不重要的目录标题

  • 前提条件
  • 第一步：新建文件夹
  • 第二步：使用VS/ VS code/cmd 打开该文件夹
  • 第三步：安装依赖
  • 第四步：试运行react
  • 第五步：整理项目结构

前提条件

安装dotnet core sdk
安装Node.js + npm

第一步：新建文件夹

选择喜欢的位置新建文件夹，然后开始摸鱼 然后进行下一步

第二步：使用VS/ VS code/cmd 打开该文件夹

在终端或cmd中直接运行

cd yourProjectAddress
dotnet new react

VS Code 如下图
在这里插入图片描述

第三步：安装依赖

我们新初始化的项目并没有安装包，特别是前端部分，所以需要先安装

cd ClientApp
npm install #按照package.json安装
# 另外也可以使用以下语句单独安装
npm install <package_name>

第四步：试运行react

使用以下语句运行

npm start

顺利的话会出现这样的结果
在这里插入图片描述
之后点开跳转到网页看看
可能会出现这种情况
在这里插入图片描述
点击Advanced， 再点击Proceed前往就行
在这里插入图片描述
看到这样的网页就算完成了
在这里插入图片描述

第五步：整理项目结构

右键新建文件夹src，然后把.Net的一些文件挪过去
在这里插入图片描述
之后在src同级目录下运行，创建解决方案

dotnet new sln

之后会出现项目名.sln
在这里插入图片描述

dotnet sln add src/yourProject.csproj

将项目“yourProject.csproj”添加到解决方案中。
之后编辑src/yourProject.csproj

替换SpaRoot 这行，改变目录，因为文件位置改了

<SpaRoot>..\ClientApp\</SpaRoot> #new
<SpaRoot>ClientApp\</SpaRoot> #old

最后尝试一下打包

dotnet build

没有报错就算完成了
在这里插入图片描述

如果有帮助到你，点个赞吧！！！

相关文章：

Azure + React + ASP.NET Core 项目笔记一：项目环境搭建（一）

不重要的目录标题 前提条件第一步&#xff1a;新建文件夹第二步&#xff1a;使用VS/ VS code/cmd 打开该文件夹第三步&#xff1a;安装依赖第四步&#xff1a;试运行react第五步&#xff1a;整理项目结构 前提条件 安装dotnet core sdk 安装Node.js npm 第一步&#xff1a;新…...

编程日记 2023/9/10 8:37:47

html 学习 之 文本标签

下面是一些常见的HTML文本标签&#xff08;&#xff0c;&#xff0c;&#xff0c;&#xff0c;和&#xff09;以及它们的作用&#xff1a; 标签 (Emphasis - 强调): 作用&#xff1a;用于在文本中表示强调或重要性。 示例&#xff1a; <p>这是一段文本&#xff0c;&l…...

编程日记 2023/9/10 8:36:46

联发科3纳米芯片预计2024年量产，此前称仍未获批给华为供货

9月7日&#xff0c;联发科与台积电共同宣布&#xff0c;联发科首款采用台积电3纳米制程生产的天玑旗舰芯片开发进度顺利&#xff0c;已成功流片&#xff0c;预计将在2024年量产&#xff0c;并将于下半年正式上市。这款旗舰芯片并非今年上市的天玑9300。 据联发科总经理陈冠州介…...

编程日记 2023/9/10 8:35:44

搭建vue3项目并git管理

搭建vue3项目 采用vue3的create-vue脚手架搭建项目&#xff0c;底层是vite&#xff0c;要求环境 node 16.0及以上&#xff08;node -v检查node版本&#xff09; 在文件夹右键->终端-> npm init vuelatest&#xff0c;输入项目名称&#xff0c;根据需要选择是否装包 src…...

编程日记 2023/9/10 8:34:43

【Azure OpenAI】OpenAI Function Calling 101

概述 本文是结合 github&#xff1a;OpenAI Function Calling 101在 Azure OpenAI 上的实现&#xff1a; Github Function Calling 101 如何将函数调用与 Azure OpenAI 服务配合使用 - Azure OpenAI Service 使用像ChatGPT这样的llm的困难之一是它们不产生结构化的数据输出…...

编程日记 2023/9/10 8:33:40

立晶半导体Cubic Lattice Inc 专攻音频ADC,音频DAC,音频CODEC,音频CLASS D等CL7016

概述&#xff1a; CL7016是一款高保真USB Type-C兼容音频编解码芯片。可以录制和回放有24比特音乐和声音。内置回放通路信号动态压缩&#xff0c; 最大42db录音通路增益&#xff0c;PDM数字麦克风&#xff0c;和立体声无需电容耳机驱动放大器。 5V单电源供电。兼容USB 2.0全速工…...

编程日记 2023/9/10 8:32:38

【Flutter】支持多平台 多端保存图片到本地相册 (兼容 Web端 移动端 android 保存到本地)

免责声明: 我只测试了Web端 和 Android端 可行哈 import dart:io; import package:flutter/services.dart; import package:http/http.dart as http; import package:universal_html/html.dart as html; import package:oktoast/oktoast.dart; import package:image_gallery_sa…...

编程日记 2023/9/10 8:31:37

postgresql 安装教程

postgresql 安装教程 本文以window 15版本为教程 文章目录 postgresql 安装教程1.下载地址2.以管理员身份运行3.选择安装路径&#xff0c;点击Next4.选择组件&#xff08;默认都勾选&#xff09;&#xff0c;点击Next5.选择数据存储路径&#xff0c;点击Next6.设置超级用户的…...

编程日记 2023/9/10 8:30:37

手写数据库连接池

数据库连接是个耗时操作.对数据库连接的高效管理影响应用程序的性能指标. 数据库连接池正是针对这个问题提出来的. 数据库连接池负责分配,管理和释放数据库连接.它允许应用程序重复使用一个现有的数据路连接,而不需要每次重新建立一个新的连接,利用数据库连接池将明显提升对数…...

编程日记 2023/9/10 8:29:34

在CentOS7上增加swap空间

在CentOS7上增加swap空间 在CentOS7上增加swap空间&#xff0c;可以按照以下步骤进行操作&#xff1a; 使用以下命令检查当前swap使用情况&#xff1a; swapon --show创建一个新的swap文件。你可以根据需要指定大小。例如&#xff0c;要创建一个2GB的swap文件&#xff0c;使用…...

编程日记 2023/9/10 8:28:33

@Autowired和@Resource

文章目录 简介Autowired注解什么是Autowired注解Autowired注解的使用方式Autowired注解的优势和不足 Qualifier总结&#xff1a; Resource注解什么是Resource注解Resource注解的使用方式Resource注解的优势和不足 Autowired vs ResourceAutowired和Resource的区别为什么推荐使用…...

编程日记 2023/9/10 8:27:32

QTableView通过setColumnWidth设置了列宽无效的问题

在用到QT的QTableView时&#xff0c;为了显示效果&#xff0c;向手动的设置每一列的宽度&#xff0c;但是如下的代码是无效的。 ui->tableView->setColumnWidth(0,150);ui->tableView->setColumnWidth(1,150);ui->tableView->setColumnWidth(2,150);ui->t…...

编程日记 2023/9/10 8:26:31

【用unity实现100个游戏之10】复刻经典俄罗斯方块游戏

文章目录 前言开始项目网格生成Block方块脚本俄罗斯方块基类&#xff0c;绘制方块形状移动逻辑限制移动自由下落下落后设置对应风格为不可移动类型检查当前方块是否可以向指定方向移动旋转逻辑消除逻辑游戏结束逻辑怪物生成源码参考完结 前言 当今游戏产业中&#xff0c;经典游…...

编程日记 2023/9/10 8:25:29

Docker容器内数据备份到系统本地

Docker运行容器时没将目录映射出来&#xff0c;或者因docker容器内外数据不一致&#xff0c;导致docker运行错误的&#xff0c;可以使用以下步骤处理&#xff1a; 1.进入要备份的容器&#xff1a; docker exec -it <容器名称或ID> /bin/bash2.在容器内创建一个临时目录…...

编程日记 2023/9/10 8:24:27

学信息系统项目管理师第4版系列06_项目管理概论

1. 项目基础 1.1. 项目是为创造独特的产品、服务或成果而进行的临时性工作 1.1.1. 独特的产品、服务或成果 1.1.2. 临时性工作 1.1.2.1. 项目有明确的起点和终点 1.1.2.2. 不一定意味着项目的持续时间短 1.1.2.3. 临时性是项目的特点&#xff0c;不是项目目标的特点 1.1…...

编程日记 2023/9/10 8:23:26

Java发送（QQ）邮箱、验证码发送

前言 使用Java应用程序发送 E-mail 十分简单&#xff0c;但是首先需要在项目中导入 JavaMail API 和Java Activation Framework (JAF) 的jar包。 菜鸟教程提供的下载链接&#xff1a; JavaMail mail.jar 1.4.5JAF&#xff08;版本 1.1.1&#xff09; activation.jar 1、准备…...

编程日记 2023/9/10 8:22:25

PostgresSQL----基于Kubernetes部署PostgresSQL

【PostgresSQL----基于Kubernetes部署PostgresSQL】 文章目录 一、创建SC、PV和PVC存储对象1.1 准备一个nfs服务器1.2 编写SC、PV、PVC等存储资源文件1.3 编写部署PostgresSQL数据库的资源声明文件 二、部署PostgresSQL2.1 部署 PV、PVC等存储对象2.2 部署PostgresSQL数据库2.3…...

编程日记 2023/9/10 8:21:24

7 个适合初学者的项目，可帮助您开始使用 ChatGPT

推荐&#xff1a;使用 NSDT场景编辑器快速搭建3D应用场景 从自动化日常任务到预测复杂模式&#xff0c;人工智能正在重塑行业并重新定义可能性。 当我们站在这场人工智能革命中时&#xff0c;我们必须了解它的潜力并将其整合到我们的日常工作流程中。 然而。。。我知道开始使…...

编程日记 2023/9/10 8:20:23

JDBC操作SQLite的工具类

直接调用无需拼装sql 注入依赖 <dependency><groupId>org.xerial</groupId><artifactId>sqlite-jdbc</artifactId><version>3.43.0.0</version></dependency>工具类 import org.sqlite.SQLiteConnection;/*** Author cpf* Dat…...

编程日记 2023/9/10 8:19:22

SEO百度优化基础知识全解析（了解百度SEO标签作用）

百度SEO优化的作用介绍&#xff1a; 百度SEO优化是指通过对网站的内部结构、外部链接、内容质量、用户体验等方面进行优化&#xff0c;提升网站在百度搜索结果中的排名&#xff0c;从而提高网站的曝光率和流量。通过百度SEO优化&#xff0c;可以让更多的潜在用户找到你的网站&…...

编程日记 2023/9/10 8:18:21

用python实现基本数据结构【03/4】

说明 如果需要用到这些知识却没有掌握&#xff0c;则会让人感到沮丧&#xff0c;也可能导致面试被拒。无论是花几天时间“突击”&#xff0c;还是利用零碎的时间持续学习&#xff0c;在数据结构上下点功夫都是值得的。那么Python 中有哪些数据结构呢&#xff1f;列表、字典、集…...

编程日记 2023/9/10 8:17:20

软件测试面试题汇总

测试技术面试题 软件测试面试时一份好简历的重要性 1、什么是兼容性测试&#xff1f;兼容性测试侧重哪些方面&#xff1f; 5 2、我现在有个程序&#xff0c;发现在Windows上运行得很慢&#xff0c;怎么判别是程序存在问题还是软硬件系统存在问题&#xff1f; 5 3、测试的策略…...

编程日记 2023/9/10 8:16:18

AP5101C 高压线性恒流IC 宽电压6-100V LED汽车大灯照明 台灯LED矿灯 指示灯电源驱动

产品描述 AP5101C 是一款高压线性 LED 恒流芯片 &#xff0c; 外围简单 、 内置功率管 &#xff0c; 适用于6- 100V 输入的高精度降压 LED 恒流驱动芯片。电流2.0A。AP5101C 可实现内置MOS 做 2.0A,外置 MOS 可做 3.0A 的。AP5101C 内置温度保护功能 &#xff0c;温度保护点为…...

编程日记 2023/9/10 8:15:16

【大数问题】字符串相减（大数相减）＜模拟＞

类似 【力扣】415. 字符串相加&#xff08;大数相加&#xff09;&#xff0c;实现大数相减。 题解 模拟相减的过程&#xff0c;先一直使大数减小数&#xff0c;记录借位&#xff0c;最后再判断是否加负号。&#xff08;中间需要删除前导0&#xff0c;例如10001-1000000001&am…...

编程日记 2023/9/10 8:14:15

easycode生成代码模板配置

实体&#xff1a; ##引入宏定义 $!define##使用宏定义设置回调&#xff08;保存位置与文件后缀&#xff09;$!autoImport import io.swagger.annotations.ApiModel; import io.swagger.annotations.ApiModelProperty; import lombok.Data; import lombok.NoArgsConstructor; i…...

编程日记 2023/9/10 8:13:14

【数据结构】堆排序和Top-k问题

【数据结构】堆 堆排序 如果只是将待排数组建立一个大堆或者小堆是无法得到一个升序或者降序的数组&#xff0c;因为对与一个堆&#xff0c;我们没法知道同一层的大小关系。 但是&#xff0c;如果建立了一个大堆&#xff0c;那么堆顶元素一定是这个数组中最大的&#xff0c;…...

编程日记 2023/9/10 8:12:12

经典的生产者和消费者模型问题

典型的生产者-消费者问题，可以使用 Java 中的 java.util.concurrent 包提供的 BlockingQueue 来实现。BlockingQueue 是一个线程安全的队列，它可以处理这种生产者-消费者的场景。以下是一个示例代码： import java.util.concurrent.ArrayBlockingQueue; import java.util.co…...

编程日记 2023/9/10 8:11:11

Java基础：代理

这里写目录标题 什么是代理1.静态代理&#xff08;委托类、代理类&#xff09;&#xff1a;使用步骤&#xff1a;示例优缺点 2.动态代理&#xff08;委托类、中介类&#xff09;2.1 JDK动态代理使用&#xff1a;中介类&#xff1a;示例1&#xff1a;示例2&#xff1a; 2.2 CGLi…...

编程日记 2023/9/10 8:10:10

每日一学——防火墙2

防火墙是一种网络安全设备&#xff0c;用于保护计算机网络免受未经授权的访问、攻击和恶意行为的影响。以下是一些防火墙的基本概念&#xff1a; 防火墙规则&#xff1a;防火墙会根据预先设置的规则来决定允许或拒绝特定的网络流量。这些规则可以指定源 IP 地址、目标 IP 地址、…...

编程日记 2023/9/10 8:09:09

Web学习笔记-React（组合Components）

笔记内容转载自 AcWing 的 Web 应用课讲义&#xff0c;课程链接&#xff1a;AcWing Web 应用课。 CONTENTS 1. 创建父组件2. 从上往下传递数据3. 传递子节点4. 从下往上调用函数5. 兄弟组件间传递消息6. 无状态函数组件7. 组件的生命周期 本节内容是组件与组件之间的组合&#…...

编程日记 2023/9/10 8:08:07

深圳优化公司/网络建站优化科技

Erasure Codes 基本思想 优点 缺点 Reed-Solomon (RS) 通常称为RS码&#xff0c;是一种线性分组循环冗余码。RS码中编码后的数据通常包括数据信息和校正信息。而在RS码中信息并不是以bit位进行处理的&#xff0c;而是以数位bit组成一个码中的符号位进行处理。通常编码符…...

编程日记 2024/11/30 5:19:46

wordpress安装后/免费网站制作成品

下了很大决心挖这个坑&#xff0c;虽然之前对kvm有些了解&#xff0c;但纸上得来终觉浅&#xff0c;只有深入到代码层面&#xff0c;才能摈弃皮毛&#xff0c;看到血肉&#xff0c;看到真相。作为挖坑的奠基石&#xff0c;准备写上几篇&#xff1a;kvm基本工作原理、CPU调度原理…...

编程日记 2024/11/30 3:46:55

html5手机网站/开发外包网站

一、算法实现 冒泡排序的时间复杂度为O&#xff08;n^2&#xff09;&#xff0c;其实现代码如下&#xff1a; int bubble_sort(int *array, int num) {int i0, j0, idx0, max0;for(idx1; idx<num; idx){array[0] array[1]; /* array[0]为交换空间 */max num-idx1;for(j2…...

编程日记 2024/11/29 20:50:10

临夏州建设局网站/公司网站设计报价

在使用android stdio的时候 由于导入了两个第三方的包&#xff0c;出现了 Error:Execution failed for task : :dexDebug. > com.android.ide.common.process.ProcessException这样的错误。 解决方法很简单首先在module的build.gradle文件中&#xff0c;删除引用的语句&…...

编程日记 2024/11/29 20:14:45

有哪些专门做写字楼的网站/网络优化的内容包括哪些

C语言的一本經典教材内容&#xff0c;是以FAQ的方式得出495个C语言易错误的事例&#xff0c;很合适学习培训和招聘面试用&#xff0c;这书构造清楚&#xff0c;解读深入&#xff0c;是各高等院校有关技术专业C语言课程内容非常好的课堂教学教材&#xff0c;也是核心层C语言程序…...

编程日记 2024/11/29 17:37:10

aspnet网站开发/爱站网关键词挖掘机

官方教程&#xff1a; https://docs.microsoft.com/zh-cn/visualstudio/ide/create-a-visual-basic-winform-in-visual-studio?viewvs-2019...

编程日记 2024/11/29 15:17:38