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

webpack 和 ts 简单配置及使用

如何使用webpack 与 ts结合使用
新建项目 ,执行项目初始化

npm init -y

会生成

{"name": "tsdemo01","version": "1.0.0","description": "","main": "index.js","scripts": {"test": "echo \"Error: no test specified\" && exit 1","build":"webpack"},"keywords": [],"author": "","license": "ISC","devDependencies": {"ts-loader": "^9.4.4","typescript": "^5.1.6","webpack": "^5.88.2","webpack-cli": "^5.1.4"}
}

安装依赖 :
-D 开发依赖 等价于 --save-dev

npm i -D webpack webpack-cli typescript ts-loader

根目录下新建webpack.config.js,webpack的配置文件

// 引入path库 用于拼接路径
const path =  require('path')
//webpack 所有配置信息都写在module.exports中
module.exports={// 指定入口文件entry: './src/index.ts',// 指定打包文件所在目录output:{// 指定打包文件的目录path:path.resolve(__dirname,'dist'),//打包后的文件 出口filename:"bundle.js"},// 指定webpack打包时要使用的模块module:{// 指定要加载的规则rules:[{	//test 指定的是规则生效的文件 以ts结尾的文件test:/\.ts$/,// 要使用的loaderuse:'ts-loader',//要排除的文件exclude:/node-modules/			}]}
}

在根目录下 新建tsconfig.json

{"compilerOptions":{"module":"ES2015","target":"ES2015","strict":true}
}

在package.json 的scripts中添加

"build":"webpack"

都配置好后,执行 npm run build
在目录下看到dist文件,就是成功拉!
执行结果

在项目中,需要在页面中引入js使用,
html-weback-plugin是自动生成html文件,并且自动引入相关资源

npm i -D html-webpack-plugin

配置的webpack.config.js

// 引入path库 用于拼接路径
const path = require('path');
// 引入html-webpack-plugin
const HTMLWebpackPlugin = require('html-webpack-plugin');//webpack 所有配置信息都写在module.exports中
module.exports = {// 指定入口文件entry: './src/index.ts',// 指定打包文件所在目录output: {// 指定打包文件的目录path: path.resolve(__dirname, 'dist'),//打包后的文件 出口filename: 'bundle.js',},// 指定webpack打包时要使用的模块module: {// 指定要加载的规则rules: [{//test 指定的是规则生效的文件 以ts结尾的文件test: /\.ts$/,// 要使用的loaderuse: 'ts-loader',//要排除的文件exclude: /node-modules/,},],},plugins: [new HTMLWebpackPlugin({title: '我是自定义title',}),],
};

再执行 npm run build 时,目录会变更
自动生成html
如果想有个模板,可以在src下新增一个index,html

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>我是模板</title>
</head>
<body><div id="box1">我是模板的div1</div>
</body>
</html>

在webpack.config.js中,把title 换为template

// 引入path库 用于拼接路径
const path = require('path');
// 引入html-webpack-plugin
const HTMLWebpackPlugin = require('html-webpack-plugin');//webpack 所有配置信息都写在module.exports中
module.exports = {// 指定入口文件entry: './src/index.ts',// 指定打包文件所在目录output: {// 指定打包文件的目录path: path.resolve(__dirname, 'dist'),//打包后的文件 出口filename: 'bundle.js',},// 指定webpack打包时要使用的模块module: {// 指定要加载的规则rules: [{//test 指定的是规则生效的文件 以ts结尾的文件test: /\.ts$/,// 要使用的loaderuse: 'ts-loader',//要排除的文件exclude: /node-modules/,},],},plugins: [new HTMLWebpackPlugin({// title: '我是自定义title',template: './src/index.html',}),],
};

执行打包 npm run build 就会出现下图:
固定模板打包后文件
可使用webpack-dev-server 对代码进行实时的编译监控
下载:npm i -D webpack-dev-server
在package.json中配置scripts 中新增 “start”: “webpack serve --open”

"scripts": {"test": "echo \"Error: no test specified\" && exit 1","build": "webpack","start": "webpack serve --open"},

执行 npm run start
当代码修改,检查到后,页面会实时的进行更新

打包清空上一次内容:可使用 clean-webpack-plugin
写法与html-webpack-plugin相同
webpack.config.js文件:

// 引入path库 用于拼接路径
const path = require('path');
// 引入html-webpack-plugin
const HTMLWebpackPlugin = require('html-webpack-plugin');
// 引入clean插件
const { CleanWebpackPlugin } = require('clean-webpack-plugin');//webpack 所有配置信息都写在module.exports中
module.exports = {// 指定入口文件entry: './src/index.ts',// 指定打包文件所在目录output: {// 指定打包文件的目录path: path.resolve(__dirname, 'dist'),//打包后的文件 出口filename: 'bundle.js',},// 指定webpack打包时要使用的模块module: {// 指定要加载的规则rules: [{//test 指定的是规则生效的文件 以ts结尾的文件test: /\.ts$/,// 要使用的loaderuse: 'ts-loader',//要排除的文件exclude: /node-modules/,},],},plugins: [new CleanWebpackPlugin(),new HTMLWebpackPlugin({// title: '我是自定义title',template: './src/index.html',}),],// 设置引用模块resolve: {// 以.ts 和.js为结尾的扩展名文件可以做模板使用extensions: ['.ts', '.js'],},
};

比如src下另有一个item1.ts

export const hi = '你好';

想在index.ts引入,

import { hi } from './item1';
let a: string;
a = 'aaa';
console.log(a);
function sum(a: number, b: number): number {return a + b;
}
console.log(sum(211, 234));
console.log('hi----', hi);

直接引入,打印,在npm run build 时,会报错
解决方法是webpack.config.js配置下

// 设置引用模块resolve: {extensions: ['.ts', '.js'],}, 

写上这个就可以在ts中引入其他ts文件中的变量
再次打包 npm run build 就不会报错了
最后结果

就执行成功拉

相关文章:

webpack 和 ts 简单配置及使用

如何使用webpack 与 ts结合使用 新建项目 &#xff0c;执行项目初始化 npm init -y会生成 {"name": "tsdemo01","version": "1.0.0","description": "","main": "index.js","scripts&…...

MATLAB算法实战应用案例精讲-【图像处理】交并比

目录 交并比 非极大值抑制 Soft NMS Soft NMS 提出背景 Soft NMS 算法流程 Soft NMS 算法示例...

[Machine Learning] decision tree 决策树

&#xff08;为了节约时间&#xff0c;后面关于机器学习和有关内容哦就是用中文进行书写了&#xff0c;如果有需要的话&#xff0c;我在目前手头项目交工以后&#xff0c;用英文重写一遍&#xff09; &#xff08;祝&#xff0c;本文同时用于比赛学习笔记和机器学习基础课程&a…...

【数学建模】-- 数学规划模型

概述&#xff1a; 什么是数学规划&#xff1f; 数学建模中的数学规划是指利用数学方法和技巧对问题进行数学建模&#xff0c;并通过数学规划模型求解最优解的过程。数学规划是一种数学优化方法&#xff0c;旨在找到使目标函数达到最大值或最小值的变量取值&#xff0c;同时满足…...

SpringBoot使用RabbitMQ自动创建Exchange和Queue

背景 小项目&#xff0c;使用RabbitMQ作为消息队列&#xff0c;发布到不同的新环境时&#xff0c;由于新搭建的MQ中不存在Exchange和Queue&#xff0c;就会出错&#xff0c;还得手动去创建&#xff0c;比较麻烦&#xff0c;于是想在代码中将这些定义好后&#xff0c;自动控制M…...

【设计模式】订单状态流传中的状态机与状态模式

文章目录 1. 前言2.状态模式2.1.订单状态流转案例2.1.1.状态枚举定义2.1.2.状态接口与实现2.1.3.状态机2.1.4.测试 2.2.退款状态的拓展2.2.1.代码拓展2.2.2.测试 2.3.小结 3.总结 1. 前言 状态模式一般是用在对象内部的状态流转场景中&#xff0c;用来实现状态机。 什么是状态…...

2.js中attr()用来修改或者添加属性或者属性值

attr()可以用来修改或者添加属性或者属性值 例&#xff1a;<input type"button" class"btn btn-info" id"subbtn" style"font-size:12px" value"我也说一句"/>1.如果想获取input中value的值 $(#subbtn).attr(value);…...

【虫洞攻击检测】使用多层神经网络的移动自组织网络中的虫洞攻击检测研究(Matlab代码实现)

&#x1f4a5;&#x1f4a5;&#x1f49e;&#x1f49e;欢迎来到本博客❤️❤️&#x1f4a5;&#x1f4a5; &#x1f3c6;博主优势&#xff1a;&#x1f31e;&#x1f31e;&#x1f31e;博客内容尽量做到思维缜密&#xff0c;逻辑清晰&#xff0c;为了方便读者。 ⛳️座右铭&a…...

微分流形学习之一:基本定义

微分流形学习之一&#xff1a;基本定义引入 引言一、微分流形的历史简介二、拓扑空间三、微分流形 引言 本文是作者在学习微分流形的时候的笔记&#xff0c;尽量严格完整&#xff0c;并带有一定理解&#xff0c;绝不是结论的简单罗列。如果读者知道数学分析中的 ϵ − δ \ep…...

[C++]笔记-制作自己的静态库

一.静态库的创建 在项目属性c/c里面,选用无预编译头,创建头文件与cpp文件,需要注意release模式下还是debug模式,在用库时候要与该模式相匹配,库的函数实现是外界无法看到的,最后在要使用的项目里面导入.h文件和.lib文件 二.使用一个循环给二维数组赋值 行数 : 第几个元素 / …...

优酷视频码率、爱奇艺视频码率、B站视频码率、抖音视频码率对比

优酷视频码率、爱奇艺视频码率与YouTube视频码率对比 优酷视频码率&#xff1a; 优酷的视频码率可以根据视频质量、分辨率和内容类型而变化。一般而言&#xff0c;优酷提供了不同的码率选项&#xff0c;包括较低的标清&#xff08;SD&#xff09;码率和较高的高清&#xff08;…...

用pytorch实现google net

GoogleNet&#xff08;也称为Inception v1&#xff09;是由Google在2014年提出的一个深度卷积神经网络架构。它在ImageNet Large Scale Visual Recognition Challenge (ILSVRC) 2014比赛中取得了优秀的成绩&#xff0c;并引起了广泛的关注。 GoogleNet的设计目标是构建一个更…...

2023-8-15差分矩阵

题目链接&#xff1a;差分矩阵 #include <iostream>using namespace std;const int N 1010;int n, m, q; int a[N][N], b[N][N];void insert(int x1, int y1, int x2, int y2, int c) {b[x1][y1] c;b[x1][y2 1] - c;b[x2 1][y1] - c;b[x2 1][y2 1] c; }int main…...

物理公式分类

(99 封私信 / 81 条消息) 定义式和决定式有什么区别&#xff0c;怎么区分&#xff1f; - 知乎 (zhihu.com) 1、首先&#xff0c;定义一个物理符号&#xff08;物理量&#xff09;来表征物理世界最直观/最基本的物理现象&#xff0c;例如&#xff0c;长度&#xff08;米&#xf…...

vue实现登录注册

目录 一、登录页面 二、注册页面 三、配置路由 一、登录页面 <template><div class"login_container" style"background-color: rgb(243,243,243);height: 93.68vh;background-image: url(https://ts1.cn.mm.bing.net/th/id/R-C.f878c96c4179c501a6…...

SpringBoot复习:(55)在service类中的方法上加上@Transactional注解后,Spring底层是怎么生成代理对象的?

SpringBoot run方法代码如下&#xff1a; 可以看到它会调用refreshContext方法来刷新Spring容器&#xff0c;这个refreshContext方法最终会调用AbstractApplicationContext的refresh方法&#xff0c;代码如下 如上图&#xff0c;refresh方法最终会调用finisheBeanFactoryInit…...

常用的图像校正方法

在数字图像处理中&#xff0c;常用的校正方法包括明场均匀性校正、查找表&#xff08;LUT&#xff09;校正和伽玛&#xff08;Gamma&#xff09;校正。这些校正方法分别针对不同的图像问题&#xff0c;可以改善图像质量&#xff0c;提升图像的可读性和可分析性。下面是这三种校…...

AWS security 培训笔记

云计算的好处 Amazon S3 (Storage) Amazon EC2 (Compute) 上图aws 的几个支柱&#xff1a;安全是其中一个啦 其中安全有几个方面 IAMdetection基础架构保护数据保护应急响应 关于云供应商的责任 data center 原来长这样 &#xff0c;据说非常之隐蔽的 如果有天退役了&#xf…...

设计模式之代理模式(Proxy)的C++实现

1、代理模式的提出 在组件的开发过程中&#xff0c;有些对象由于某种原因&#xff08;比如对象创建的开销很大&#xff0c;或者对象的一些操作需要做安全控制&#xff0c;或者需要进程外的访问等&#xff09;&#xff0c;会使Client使用者在操作这类对象时可能会存在问题&…...

vim 配置环境变量与 JDK 编译器异常

vim 配置环境变量 使用 vim 打开系统中的配置信息&#xff08;不存在将会创建&#xff09;&#xff1a; vim ~/.bash_profile 以配置两个版本 JDK 为例&#xff08;前提是已安装 JDK&#xff09;,使用上述命令打开配置信息&#xff1a; 输入法调成英文&#xff0c;输入 i&…...

TiDB v7.1.0 跨业务系统多租户解决方案

本文介绍了 TiDB 数据库的资源管控技术&#xff0c;并通过业务测试验证了效果。资源管控技术旨在解决多业务共用一个集群时的资源隔离和负载问题&#xff0c;通过资源组概念&#xff0c;可以限制不同业务的计算和 I/O 资源&#xff0c;实现资源隔离和优先级调度&#xff0c;提高…...

【题解】二叉树中和为某一值的路径(一)

二叉树中和为某一值的路径(一) 题目链接&#xff1a;二叉树中和为某一值的路径(一) 解题思路1&#xff1a;递归 我们或许想记录下每一条从根节点到叶子节点的路径&#xff0c;计算出该条路径的和&#xff0c;但此种思路用递归稍麻烦&#xff0c;我们可以试着把和转换为差&am…...

css中变量和使用变量和运算

变量&#xff1a; 语法&#xff1a;--css变量名&#xff1a;值&#xff1b; --view-theme: #1a99fb; css使用变量&#xff1a; 语法&#xff1a;属性名&#xff1a;var( --css变量名 )&#xff1b; color: var(--view-theme); css运算&#xff1a; 语法&#xff1a;属性名…...

数据结构之线性表的类型运用Linear Lists: 数组,栈,队列,链表

线性表 定义 一个最简单&#xff0c;最基本的数据结构。一个线性表由多个相同类型的元素穿在一次&#xff0c;并且每一个元素都一个前驱&#xff08;前一个元素&#xff09;和后继&#xff08;后一个元素&#xff09;。 线性表的类型 常见的类型&#xff1a;数组、栈、队列…...

成瘾机制中微生物群的神秘角色

谷禾健康 成瘾是一种大脑疾病&#xff0c;受害者无法控制地对某种物质或行为产生强烈的依赖和渴求&#xff0c;尽管这种行为会产生有害的后果。成瘾包括一系列物质滥用障碍&#xff0c;例如药物、酒精、香烟&#xff0c;过度饮食。近年来&#xff0c;吸毒成瘾急剧上升&#xff…...

arm安装docker与docker-copose

一、银河麒麟Arm64安装docker 1、docker 安装包地址&#xff1a; https://download.docker.com/linux/static/stable 2、解压&#xff0c;然后将docker目录下文件拷贝到/usr/bin里 tar -xf docker-18.09.3.tgz mv docker/* /usr/bin/ 3、准备 docker.service系统配置文件 &…...

9.文件基本操作

第四章 文件管理 9.文件基本操作 ​    “打开文件和关闭文件”与平常鼠标双击打开文件和点击“X”关闭文件是有所不同的。 ​    操作系统在处理open系统调用时主要做了以下两件事情&#xff0c;①根据我们提供的文件存放路径在外存当中找到这个目录对应的目录表&#x…...

【Java】Spring——Bean对象的作用域和生命周期

文章目录 前言一、引出Bean对象的作用域1.普通变量的作用域2.Bean对象的作用域 二、Bean对象的作用域1.Bean对象的6种作用域2.设置Bean对象的作用域 三、Bean对象的生命周期总结 前言 本人是一个普通程序猿!分享一点自己的见解,如果有错误的地方欢迎各位大佬莅临指导,如果你也…...

数字孪生助力智慧水务:科技创新赋能水资源保护

智慧水务中&#xff0c;数字孪生有着深远的作用&#xff0c;正引领着水资源管理和环境保护的创新变革。随着城市化和工业化的不断推进&#xff0c;水资源的可持续利用和管理愈发显得重要&#xff0c;而数字孪生技术为解决这一挑战提供了独特的解决方案。 数字孪生技术&#xf…...

css 实现文字横向循环滚动

实现效果 思路 ## 直接上代码,html部分 //我这里是用的uniapp <view class"weather_info_wrap"><view class"weather_info">当前多云&#xff0c;今晚8点转晴&#xff0c;明天有雨&#xff0c;温度32摄氏度。</view><view class&qu…...

VuePress 数学公式支持

前言 博主在为 VuePress1.0 博客添加数学公式支持过程中遇到如下问题 问题一 在配置诸如 markdown-it-texmath,markdown-it-katex,markdown-it-mathjax3 这些插件后遇到 Error: Dynamic require of "XXX" is not supported 问题二 配置插件 vuepress-plugin-ma…...

stm32控制蜂鸣器源代码(附带proteus线路图)

说明&#xff1a; 1 PB0输出0时&#xff0c;蜂鸣器发生&#xff1b; 2 蜂鸣器电阻值如果太大会导致电流太小&#xff0c;发不出声音&#xff1b; 3蜂鸣器额定电压需要设置得低一点&#xff0c;可以是2V&#xff0c;但不能高于3V&#xff0c;这更右上角的电阻值有关系&#x…...

selinux

一、selinux的说明 二、selinux的工作原理 三、selinux的启动、关闭与查看 Enforcing和permissive都是临时的&#xff0c;重启还是依据配置文件中&#xff0c;禁用selinux&#xff0c;修改配置文件&#xff1a; 之后重启生效 四、selinux对linux服务的影响...

使用opencv4.7.0部署yolov5

yolov5原理和部署原理就不说了&#xff0c;想了解的可以看看这篇部署原理文章 #include <fstream> #include <sstream> #include <iostream> #include <opencv2/dnn.hpp> #include <opencv2/imgproc.hpp> #include <opencv2/highgui.hpp>/…...

Python - 协程基本使用详解【demo】

一. 前言 协程&#xff08;Coroutine&#xff09;是一种轻量级的线程&#xff0c;也被称为用户级线程或绿色线程。它是一种用户态的上下文切换方式&#xff0c;比内核态的线程切换更为轻量级&#xff0c;能够高效的支持大量并发操作。 2. 使用协程的好处 Python 中的协程是通…...

Android MVVM架构模式,详详详细学习

MVVM&#xff08;Model-View-ViewModel&#xff09; 是一种基于数据绑定的架构模式&#xff0c;用于设计和组织应用程序的代码结构。它将应用程序分为三个主要部分&#xff1a;Model&#xff08;模型&#xff09;、View&#xff08;视图&#xff09;和ViewModel&#xff08;视…...

亿赛通电子文档安全管理系统 RCE漏洞复现

0x01 产品简介 亿赛通电子文档安全管理系统&#xff08;简称&#xff1a;CDG&#xff09;是一款电子文档安全加密软件&#xff0c;该系统利用驱动层透明加密技术&#xff0c;通过对电子文档的加密保护&#xff0c;防止内部员工泄密和外部人员非法窃取企业核心重要数据资产&…...

星际争霸之小霸王之小蜜蜂(三)--重构模块

目录 前言 一、为什么要重构模块 二、创建game_functions 三、创建update_screen() 四、修改alien_invasion模块 五、课后思考 总结 前言 前两天我们已经成功创建了窗口&#xff0c;并将小蜜蜂放在窗口的最下方中间位置&#xff0c;本来以为今天将学习控制小蜜蜂&#xff0c;结…...

JS的解析与Js2Py使用

JS的解析与Js2Py使用 JS的解析事件监听器搜索关键字请求关联JS文件 Js2PyJs2Py的简单使用安装Js2Py执行JavaScript代码调用JavaScript函数 Js2Py的应用示例创建JavaScript文件使用JavaScript JS的解析 在一个网站中&#xff0c;登录密码通常是会进行加密操作的&#xff0c;那么…...

Spring Bean的生命周期总结(包含面试题)

目录 一、Bean的初始化过程 1. 加载Spring Bean 2. 解析Bean的定义 3. Bean属性定义 4. BeanFactoryPostProcessor 扩展接口 5. 实例化Bean对象 6. Aware感知 7. 初始化方法 8. 后置处理 9. destroy 销毁 二、Bean的单例与多例模式 2.1 单例模式&#xff08;Sin…...

SpringjDBCTemplate_spring25

1、首先导入两个包&#xff0c;里面有模板 2、transtion事务 jDbc操作对象&#xff0c;底层默认的是事务&#xff1a; 3、我们java一般对实体类进行操作。 4、第一步写好坐标。 创建一个Account表 数据修改用update 数据进去了...

设计模式——桥接模式

引用 桥我们大家都熟悉&#xff0c;顾名思义就是用来将河的两岸联系起来的。而此处的桥是用来将两个独立的结构联系起来&#xff0c;而这两个被联系起来的结构可以独立的变化&#xff0c;所有其他的理解只要建立在这个层面上就会比较容易。 基本介绍 桥接模式&#xff08;Br…...

改进YOLO系列:2.添加ShuffleAttention注意力机制

添加ShuffleAttention注意力机制 1. ShuffleAttention注意力机制论文2. ShuffleAttention注意力机制原理3. ShuffleAttention注意力机制的配置3.1common.py配置3.2yolo.py配置3.3yaml文件配置1. ShuffleAttention注意力机制论文 论文题目:SA-NET: SHUFFLE ATTENTION …...

利用Opencv实现人像迁移

前言&#xff1a; Hello大家好&#xff0c;我是Dream。 今天来学习一下如何使用Opencv实现人像迁移&#xff0c;欢迎大家一起参与探讨交流~ 本文目录&#xff1a; 一、实验要求二、实验环境三、实验原理及操作1.照片准备2.图像增强3.实现美颜功能4.背景虚化5.图像二值化处理6.人…...

Lnton羚通算法算力云平台在环境配置时 OpenCV 无法显示图像是什么原因?

问题&#xff1a; cv2.imshow 显示图像时报错&#xff0c;无法显示图像 0%| | 0/1 [00:00<…...

【JavaEE进阶】MyBatis的创建及使用

文章目录 一. MyBatis简介二. MyBatis 使用1. 数据库和数据表的创建2. 创建Mybatis项目2.1 添加MyBatis框架支持2.2 设置MyBatis配置信息 3. MyBatis开发流程4. MyBatis查询数据库测试 三. MyBatis 流程1. MyBatis 查询数据库流程2. MyBatis 框架交互流程图 一. MyBatis简介 M…...

职业学院物联网实训室建设方案

一、概述 1.1专业背景 物联网&#xff08;Internet of Things&#xff09;被称为继计算机、互联网之后世界信息产业第三次浪潮&#xff0c;它并非一个全新的技术领域&#xff0c;而是现代信息技术发展到一定阶段后出现的一种聚合性应用与技术提升&#xff0c;是随着传感网、通…...

3 个 ChatGPT 插件您需要立即下载3 ChatGPT Extensions You need to Download Immediately

在16世纪&#xff0c;西班牙探险家皮萨罗带领约200名西班牙士兵和37匹马进入了印加帝国。尽管印加帝国的军队数量达到了数万&#xff0c;其中包括5,000名精锐步兵和3,000名弓箭手&#xff0c;他们装备有大刀、长矛和弓箭等传统武器。但皮萨罗的军队中有100名火枪手&#xff0c;…...

屏蔽socket 实例化时,握手阶段报错信息WebSocket connection to ‘***‘ failed

事情起因是这样的&#xff1a; 我们网站是需要socket链接实行实时推送服务&#xff0c;有恶意竞争对手通过抓包或者断网&#xff0c;获取到了我们的socket链接地址&#xff0c;那么他就可以通过java写一个脚本无限链接这个socket地址。形成dos攻击。使socket服务器资源耗尽&…...

单发多框检测(SSD)【动手学深度学习】

单发多框检测模型主要由一个基础网络块和若干多尺度特征块串联而成。基本网络用于从输入图像中提取特征,可以使用深度卷积神经网络,原论文中选用了在分类层之前阶段的VGG,现在也常用ResNet替代。 我们可以设计基础网络,使它输出的高和宽较大,这样基于该特征图生成的锚框数…...