那些你面试必须知道的webpack知识点

news2024/10/5 22:23:34

目录

  • 1、webpack介绍和简单使用
    • 1.1 什么是webpack?
    • 1.2 安装webpack
    • 1.3 简单使用一下webpack
  • 2、webpack的入口与输出
    • 2.1 入口(entry)
    • 2.2 输出(output)
  • 3、入口多种配置方法
    • 3.1 多文件打包成一个文件
    • 3.2 多文件打包成多文件
  • 4、loader的概念
  • 5、压缩打包HTML
    • 5.1 使用步骤:
    • 5.2 如何进行多页面打包?
    • 5.3 如何多页面打包,并引入指定的js文件?
  • 6、HTML加入图片
  • 7、HTML加入字体图标
  • 8、单独分离css压缩打包
    • 8.1单独抽离css
    • 8.2压缩css文件

1、webpack介绍和简单使用

1.1 什么是webpack?

webpack 是一个模块打包器。webpack 的主要目标是将 JavaScript 文件打包在一起,打包后的文件用于在浏览器中使用,但它也能够胜任转换(transform)、打包(bundle)。

1.2 安装webpack

1.全局安装:

cnpm install webpack -g
cnpm install webpack-cli -g

也可以通过npm进行全局安装,最好的是使用cnpm,因为cnpm 服务部署在国内阿里云服务器上 , 可以提高包的下载速度 官方也提供了一个全局工具包 cnpm ,操作命令与 npm 大体相同。

我们可以通过 npm 来安装 cnpm 工具

npm install -g cnpm --registry=https://registry.npmmirror.com

在这里插入图片描述

安装webpack:cnpm install webpack -g

在这里插入图片描述
在这里插入图片描述
安装webpack脚手架:cnpm install webpack-cli -g
在这里插入图片描述
2、测试版本
我们来测试一下版本
在这里插入图片描述

1.3 简单使用一下webpack

说明一下:webpack本身之前是打包js的,如果要打包:html、css…需要借助一些东西。

1、进入项目目录,随便创建一个js文件
在这里插入图片描述
2、在该目录中下载webpack

cnpm install webpack -S

在这里插入图片描述
此时该目录下会多出两个文件
在这里插入图片描述
3、在终端执行:webpack进行打包
在这里插入图片描述
它告诉我们index必须在src目录下面。
我们改下文件目录
在这里插入图片描述
再次打包
在这里插入图片描述
此时目录种会多出一个dist文件夹
在这里插入图片描述
在这里插入图片描述
我们打开main.js看看发生了什么变化
在这里插入图片描述
原index.js文件:
在这里插入图片描述
打包后对代码进行了压缩。

2、webpack的入口与输出

2.1 入口(entry)

入口起点(entry point) 指示 webpack 应该使用哪个模块,来作为构建其内部 依赖图(dependency graph) 的开始。进入入口起点后,webpack 会找出有哪些模块和库是入口起点(直接和间接)依赖的。

默认值是 ./src/index.js,但你可以通过在 webpack configuration中配置 entry 属性,来指定一个(或多个)不同的入口起点。例如:
webpack.config.js

module.exports = {
  entry: './path/to/my/entry/file.js',
};

我们对上面的例子进行改造,将index.js改为script,如果此时直接打包则会报错,因为默认入口是index.js所以我们要改一下入口文件。
在这里插入图片描述
在这里插入图片描述
在webpack.config.js文件中进行改变。
在这里插入图片描述
打包:
在这里插入图片描述

2.2 输出(output)

output 属性告诉 webpack 在哪里输出它所创建的 bundle,以及如何命名这些文件。主要输出文件的默认值是 ./dist/main.js,其他生成文件默认放置在 ./dist 文件夹中。

你可以通过在配置中指定一个 output 字段,来配置这些处理过程:

webpack.config.js

const path = require('path');

module.exports = {
  entry: './path/to/my/entry/file.js',
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: 'my-first-webpack.bundle.js',
  },
};

我们对上面的例子进行改造,改变出口位置。
在这里插入图片描述

打包:
在这里插入图片描述
文件目录:
在这里插入图片描述
在这里插入图片描述

3、入口多种配置方法

3.1 多文件打包成一个文件

问题:多个入口文件==》单文件出口
解决:将entry改成数组写法,即可。

var path = require('path');
module.exports ={
    entry:['./src/script.js','./src/a.js','./src/b.js'],
    output:{
        path:path.resolve(__dirname, 'dist'),
        filename:'main.js',
    }
}

在这里插入图片描述
在这里插入图片描述

在这里插入图片描述

3.2 多文件打包成多文件

问题:多个入口文件==》多个文件出口
解决:将entry改成对象写法,key必须为文件名,值为文件路径,并且出口只写一个path即可,不要命名文件。

var path = require('path');
module.exports ={
    entry:{
        script:'./src/script.js',
        a:'./src/a.js',
        b:'./src/b.js'
    },
    output:{
        path:path.resolve(__dirname, 'dist'),
    }
}

4、loader的概念

webpack 只能理解 JavaScript 和 JSON 文件,这是 webpack 开箱可用的自带能力。loader 让 webpack 能够去处理其他类型的文件,并将它们转换为有效 模块,以供应用程序使用,以及被添加到依赖图中。
简单来说:就是webpack默认只能打包js和json文件,如果想打包html、css、图片等等类型的文件…就需要用到对应的loader。

Warning:

webpack 的其中一个强大的特性就是能通过 import 导入任何类型的模块(例如 .css 文件),其他打包程序或任务执行器的可能并不支持。我们认为这种语言扩展是很有必要的,因为这可以使开发人员创建出更准确的依赖关系图。
在更高层面,在 webpack 的配置中,loader 有两个属性:

1、test 属性,识别出哪些文件会被转换。
2、use 属性,定义出在进行转换时,应该使用哪个 loader。
webpack.config.js

const path = require('path');

module.exports = {
  output: {
    filename: 'my-first-webpack.bundle.js',
  },
  module: {
    rules: [{ test: /\.txt$/, use: 'raw-loader' }],
  },
};

在这里插入图片描述
我们对之前的例子进行改造,添加一个css样式,然后打包。
在这里插入图片描述
引入样式
在这里插入图片描述
css
在这里插入图片描述

var path = require("path");
module.exports = {
  entry: "./src/a.js",
  output: {
    path: path.resolve(__dirname, "dist"),
    filename: "main.js",
  },
  module: {
    rules: [
      {
        test: /\.css$/, //匹配任何以.css结尾的文件
        use: ["style-loader", "css-loader"],//打包css需要的loader
      },
    ],
  },
};

在打包前先安装这两个loader
在这里插入图片描述
进行打包:
在这里插入图片描述
打包后的main.js文件:
在这里插入图片描述
我们创建一个index.html文件引入打包后的main.js,看看js和css样式是否生效:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
<script src="./dist/main.js"></script>    
</body>
</html>

生效,说明打包没有问题。
在这里插入图片描述
题外话:

一般来说一个项目有特别多的loader,如果让我们一个一个下载,岂不是要疯了,所以一些框架,比如vue、react…等都是自动下载对应的loader,还有webpack的配置它也会自动生成,我们学习webpack主要是为了能够看到那些代码,并在项目需要时,更改一些配置。
不过大佬一般都能够自己配置webpack,哈哈哈哈。

5、压缩打包HTML

webpack默认只打包javascript文件和json文件,但是我们项目不可能只打包js文件,必然还要打包html文件。
想要打包html文件,那就必须用到一个插件html-webpack-plugin

5.1 使用步骤:

1、下载

cnpm install html-webpack-plugin

在这里插入图片描述
2、引入

var HtmlWebpackPlugin = require('html-webpack-plugin')

3、配置

var path = require("path");
var HtmlWebpackPlugin = require('html-webpack-plugin') //引入
module.exports = {
  entry: "./src/index.js",
  output: {
    path: path.resolve(__dirname, "dist"),
    filename: "main.js",
  },
  module: {
    rules: [
      {
        test: /\.css$/,
        use: ["style-loader", "css-loader"],
      },
    ],
  },
  plugins: [new HtmlWebpackPlugin()],//添加配置
};

在这里插入图片描述
预格式化一下,方便阅读。
在这里插入图片描述
源文件:
在这里插入图片描述
你会发现打包后,title和div消失了,这是有问题的。

主要是需要对 plugins: [new HtmlWebpackPlugin()],添加template配置项。

var path = require("path");
var HtmlWebpackPlugin = require("html-webpack-plugin");
module.exports = {
  entry: "./src/index.js",
  output: {
    path: path.resolve(__dirname, "dist"),
    filename: "main.js",
  },
  module: {
    rules: [
      {
        test: /\.css$/,
        use: ["style-loader", "css-loader"],
      },
    ],
  },
  plugins: [
    new HtmlWebpackPlugin({
      // 指定模板页面
      template: "./src/index.html",
    }),
  ],
};

查重新打包后:
在这里插入图片描述

我们也可以添加新的配置项filename,改变默认输出文件名称。

var path = require("path");
var HtmlWebpackPlugin = require("html-webpack-plugin");
module.exports = {
  entry: "./src/index.js",
  output: {
    path: path.resolve(__dirname, "dist"),
    filename: "main.js",
  },
  module: {
    rules: [
      {
        test: /\.css$/,
        use: ["style-loader", "css-loader"],
      },
    ],
  },
  plugins: [
    new HtmlWebpackPlugin({
      // 指定模板页面
      template: "./src/index.html",
      // 改变默认输出文件名称
      filename: "hhh.html",
    }),
  ],
};

在这里插入图片描述

5.2 如何进行多页面打包?

创建多个new HtmlWebpackPlugin

var path = require("path");
var HtmlWebpackPlugin = require("html-webpack-plugin");
module.exports = {
  entry: "./src/index.js",
  output: {
    path: path.resolve(__dirname, "dist"),
    filename: "main.js",
  },
  module: {
    rules: [
      {
        test: /\.css$/,
        use: ["style-loader", "css-loader"],
      },
    ],
  },
  plugins: [
    new HtmlWebpackPlugin({
      // 指定模板页面
      template: "./src/index.html",
      // 改变默认输出文件名称
      filename: "index.html",
    }),
    new HtmlWebpackPlugin({
      // 指定模板页面
      template: "./src/hhh.html",
      // 改变默认输出文件名称
      filename: "hhh.html",
    }),
  ],
};

打包多个页面,必须设置filename配置项,配置项的值必须不同。

打包后:

在这里插入图片描述

5.3 如何多页面打包,并引入指定的js文件?

比如我们有这样一个需求:
有三个js文件,分别是index.js、jquery.js、hhh.js
我需要让index.html压缩打包引入jquery.js、index.js,hhh.html压缩打包引入jquery.js、hhh.js

此时我们就需要用到这两个配置项:
chunks:允许插入到模板中的一些chunk,不配置此项默认会将entry中所有的thunk注入到模板中。在配置多个页面时,每个页面注入的thunk应该是不相同的,需要通过该配置为不同页面注入不同的thunk;

excludeChunks: 这个与chunks配置项正好相反,用来配置不允许注入的thunk。

1、改变entry入口配置
2、将output出口的filename删除
3、设置excludeChunks不允许注入哪些文件
注:前两条为什么这样设置,前文已经说过,若忘了,可往上翻阅文档。

var path = require("path");
var HtmlWebpackPlugin = require("html-webpack-plugin");
module.exports = {
  entry: {
    index: "./src/index.js",
    jquery: "./src/jquery.js",
    hhh: "./src/hhh.js",
  },
  output: {
    path: path.resolve(__dirname, "dist"),
  },
  module: {
    rules: [
      {
        test: /\.css$/,
        use: ["style-loader", "css-loader"],
      },
    ],
  },
  plugins: [
    new HtmlWebpackPlugin({
      // 指定模板页面
      template: "./src/index.html",
      // 改变默认输出文件名称
      filename: "index.html",
      excludeChunks: ["hhh"], //不允许注入hhh.js文件
    }),
    new HtmlWebpackPlugin({
      // 指定模板页面
      template: "./src/hhh.html",
      // 改变默认输出文件名称
      filename: "hhh.html",
      excludeChunks: ["index"], //不允许注入index.js文件
    }),
  ],
};

打包后(已预格式化)方便阅读代码:
在这里插入图片描述
在这里插入图片描述
详细htm-webpack-plugin文档,可观看博客园的一个博主写的文章:
https://www.cnblogs.com/wonyun/p/6030090.html

6、HTML加入图片

在index.html文件中插入图片,如果不配置对应的图片loader,则无法将图片打包。
原文件:
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
进行打包:在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
图片没有被打包。

解决:
一、下载加载图片的loader >file-loader
在这里插入图片描述
二、下载让html支持图片的loader
>html-withimg-loader
在这里插入图片描述
三、配置:在module对象中的rules数组中添加两个配置。

var path = require("path");
var HtmlWebpackPlugin = require("html-webpack-plugin");
module.exports = {
  entry: {
    index: "./src/index.js",
    jquery: "./src/jquery.js",
    hhh: "./src/hhh.js",
  },
  output: {
    path: path.resolve(__dirname, "dist"),
  },
  module: {
    rules: [
      {
        test: /\.css$/,
        use: ["style-loader", "css-loader"],
      },
      {
        test: /\.(png|jpg|jpeg|gif)$/,
        use: [
          {
            loader: "file-loader",
            options: {
              esModule: false,
              outputPath: "img/", //让图片打包到img目录下,不配置该项默认是将图片和其他文件打包到同级
            },
          },
        ],
      },
      {
        test: /\.html$/,
        use: "html-withimg-loader",
      },
    ],
  },
  plugins: [
    new HtmlWebpackPlugin({
      // 指定模板页面
      template: "./src/index.html",
      // 改变默认输出文件名称
      filename: "index.html",
      excludeChunks: ["hhh"], //不允许注入hhh.js文件
    }),
    new HtmlWebpackPlugin({
      // 指定模板页面
      template: "./src/hhh.html",
      // 改变默认输出文件名称
      filename: "hhh.html",
      excludeChunks: ["index"], //不允许注入index.js文件
    }),
  ],
};

打包后:
在这里插入图片描述

7、HTML加入字体图标

在项目中必不可少的都要使用字体图标,对于字体图标,我们也要配置相对应的loader,不然无法打包字体图标。

我们在项目中添加字体图标:
在这里插入图片描述
css里放置,字体图标的样式,fonts放置字体图标文件
在这里插入图片描述
在这里插入图片描述
iconfont.css要改变一下引入路径:
在这里插入图片描述
如需打包,不能在index,html页面进行引入,需要在index,js文件中引入。
在这里插入图片描述
我们不配置对于loader进行打包,看看效果:
在这里插入图片描述
没有打包字体图标

解决:

 {
        test:/\.(ttf|woff|woff2)$/,
        use:'file-loader?name=./fonts/[name].[ext]'//打包到指定文件夹,name为统一iconfont,ext为每个文件自己的后缀名
      }

全代码:

var path = require("path");
var HtmlWebpackPlugin = require("html-webpack-plugin");
module.exports = {
  entry: {
    index: "./src/index.js",
    jquery: "./src/jquery.js",
    hhh: "./src/hhh.js",
  },
  output: {
    path: path.resolve(__dirname, "dist"),
  },
  module: {
    rules: [
      {
        test: /\.css$/,
        use: ["style-loader", "css-loader"],
      },
      {
        test: /\.(png|jpg|jpeg|gif)$/,
        use: [
          {
            loader: "file-loader",
            options: {
              esModule: false,
              outputPath: "img/", //让图片打包到img目录下,不配置该项默认是将图片和其他文件打包到同级
            },
          },
        ],
      },
      {
        test: /\.html$/,
        use: "html-withimg-loader",
      },
      {
        test:/\.(ttf|woff|woff2)$/,
        use:'file-loader?name=./fonts/[name].[ext]'//打包到指定文件夹,name为统一iconfont,ext为每个文件自己的后缀名
      }
    ],
  },
  plugins: [
    new HtmlWebpackPlugin({
      // 指定模板页面
      template: "./src/index.html",
      // 改变默认输出文件名称
      filename: "index.html",
      excludeChunks: ["hhh"], //不允许注入hhh.js文件
    }),
    new HtmlWebpackPlugin({
      // 指定模板页面
      template: "./src/hhh.html",
      // 改变默认输出文件名称
      filename: "hhh.html",
      excludeChunks: ["index"], //不允许注入index.js文件
    }),
  ],
};

打包后:
在这里插入图片描述

8、单独分离css压缩打包

在之前我们的css都是更js打包在一起,但是我们想要它单独分离出来并进行压缩打包该怎么做呢?

8.1单独抽离css

1.下载插件:mini-css-extract-plugin
2.引入插件

var MiniCssExtractPlugin = require("mini-css-extract-plugin");

3.修改loader

 {
        test: /\.css$/,
        use: [MiniCssExtractPlugin.loader, "css-loader"],
      },

4.使用插件:

plugins:[
  // 分离css
    new MiniCssExtractPlugin(),
]

8.2压缩css文件

1.下载插件:optimize-css-assets-webpack-plugin
2.引入插件:

var OptimizeCssAssetsWebpackPlugin = require("optimize-css-assets-webpack-plugin");

3、使用插件:

plugins:[
   // 压缩css
    new OptimizeCssAssetsWebpackPlugin()
]

打包后:多出一个index.css文件
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1120391.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

DP基础相关笔记

基础 DP LIS LIS&#xff08;Longest Increasing Subsequence&#xff09;&#xff0c;顾名思义&#xff0c;就是最长上升子序列问题。 在这里我们要区分一下子串和子序列的区别&#xff0c;很简单&#xff0c;子串连续&#xff0c;子序列可以不连续。然而就在几小时之前本蒟…

分布式应用开发的核心技术系列之——基于TCP/IP的原始消息设计

本文由葡萄城技术团队原创并首发。转载请注明出处&#xff1a;葡萄城官网&#xff0c;葡萄城为开发者提供专业的开发工具、解决方案和服务&#xff0c;赋能开发者。 前言 本文的内容主要围绕以下几个部分&#xff1a; TCP/IP的简单介绍。消息的介绍。基于消息分类的传输格式&…

嵌入式养成计划-46----QT--简易版网络聊天室实现

一百一十九、简易版网络聊天室实现 119.1 QT实现连接TCP协议 119.1.1 基于TCP的通信流程 119.1.2 QT中实现服务器过程 使用QTcpServer实例化一个服务器对象设置监听状态&#xff0c;通过listen()函数&#xff0c;可以监听特定的主机&#xff0c;也可以监听所有客户端&#x…

二维码智慧门牌管理系统升级解决方案:高效、便捷、安全的外业数据管理方法

文章目录 前言一、背景与需求二、升级解决方案三、方案优势 前言 在当今的信息化社会&#xff0c;数据管理的重要性日益凸显。尤其对于像二维码智慧门牌管理系统这样的复杂系统&#xff0c;如何实现高效、便捷、安全的数据管理&#xff0c;成为了系统升级的重要议题。本文将详…

计算机数据库中了malloxx勒索病毒怎么解决,勒索病毒解密,数据恢复

随着网络技术的不断发展&#xff0c;越来越多的网络安全威胁也不断增加&#xff0c;最近&#xff0c;云天数据恢复中心接到一些企业的求助&#xff0c;企业的计算机数据库遭到了malloxx勒索病毒攻击&#xff0c;导致企业所有计算机服务器无法正常使用&#xff0c;针对此次勒索病…

51单片机定时器和中断(03)

eg1&#xff1a;数码管如何显示出字符 51单片机40个引脚的功能需要记住** RXD&#xff1a;表示的是串行输入口INT0&#xff1a;外部中断0INT1&#xff1a;外部中断1TO : 外部中断0T1 &#xff1a;外部中断1WR: 外部输入存储器写RD: 外部输出存储器读XTK2/XTL1 单片机晶振的输…

微信公众号迁移详细步骤

公众号迁移有什么作用&#xff1f;只能变更主体吗&#xff1f;很多小伙伴想做公众号迁移&#xff0c;但是不知道公众号迁移有什么作用&#xff0c;今天跟大家具体讲解一下。首先公众号迁移最主要的就是修改公众号的主体了&#xff0c;比如我们公众号原来是A公司的&#xff0c;现…

Ubuntu 22.04 中安装 fcitx5

Ubuntu 22.04 中安装 fcitx5 可以按照以下步骤进行&#xff1a; 添加 fcitx5 的 PPA 首先&#xff0c;添加 fcitx5 的官方 PPA&#xff1a; sudo add-apt-repository ppa:fcitx-team/fcitx5更新软件包列表 sudo apt update安装 fcitx5 sudo apt install fcitx5 fcitx5-conf…

基于SSM的文化培训学校网站的设计与实现

末尾获取源码 开发语言&#xff1a;Java Java开发工具&#xff1a;JDK1.8 后端框架&#xff1a;SSM 前端&#xff1a;Vue 数据库&#xff1a;MySQL5.7和Navicat管理工具结合 服务器&#xff1a;Tomcat8.5 开发软件&#xff1a;IDEA / Eclipse 是否Maven项目&#xff1a;是 目录…

030-第三代软件开发-密码输入框

第三代软件开发-密码输入框 文章目录 第三代软件开发-密码输入框项目介绍密码输入框总结一下 关键字&#xff1a; Qt、 Qml、 echoMode、 TextInput、 Image 项目介绍 欢迎来到我们的 QML & C 项目&#xff01;这个项目结合了 QML&#xff08;Qt Meta-Object Language…

【Qt控件之QMdiArea】介绍及使用

描述 QMdiArea小部件提供了一个区域&#xff0c;用于显示MDI窗口。QMdiArea的功能类似于MDI窗口的窗口管理器。例如&#xff0c;它在自身上绘制和排列管理的窗口&#xff0c;可以按级联或平铺模式排列它们。通常&#xff0c;QMdiArea被用作QMainWindow的中心小部件&#xff0c…

YOLOv5算法改进(17)— 手把手教你去更换损失函数(IoU/GIoU/DIoU/CIoU/EIoU/AlphaIoU/SIoU)

前言:Hello大家好,我是小哥谈。损失函数(loss function)是机器学习中用来衡量模型预测值与真实值之间差异的函数。它用于度量模型在训练过程中的性能,以便优化模型参数。在训练过程中,损失函数会根据模型的预测结果和真实标签计算出一个标量值,代表了模型预测的错误程度…

离散低通滤波方法

低通滤波器允许低频信号通过&#xff0c;并抑制高频信号。其核心思想是在频率域上通过移除高频成分来平滑信号。这在去噪、平滑和提取基本频率成分时非常有用。 离散低通滤波方法通常采用一阶低通滤波器进行处理。一阶低通滤波器是一种常见的数字滤波器&#xff0c;能够将信号…

分享 | 对 电商API 平台的再思考

API 是推动现代企业数字化转型的基础。它不但连接了内部应用程序、合作伙伴和客户&#xff0c;同时也快速持续地向市场提供了各种新产品、版本和功能。 但当下还是以集中式的 API 交付为主。一个企业的对外 API 交付过程通常都是冗余而繁琐的&#xff0c;对企业内部的敏捷性、速…

数据丢失恢复怎么操作好?五种方法帮您恢复数据

丢失文件可能会造成灾难性的后果&#xff0c;因此您绝对需要最好的 PC 恢复软件。数据恢复软件必须快速、可靠并涵盖大多数文件格式。我们列表中最好的工具是一个甚至可以检索隐藏文件的解决方案。我们选择的另一个解决方案能够恢复700 多种独特的文件格式。 这种噩梦可能发生…

通过WinSCP实现Windows给Ubuntu(Linux)虚拟机传输数据

要实现传输有几个准备工作需要做 1.在虚拟机运行工具&#xff08;VMware或者其他&#xff09;中设置网络&#xff08;或者网络适配器&#xff09;为桥接模式&#xff08;之前是NAT模式&#xff09; 2.使用ifconfig命令查看虚拟机的网络地址 3.确定虚拟机中安装了ssh 安装 sudo…

数组问题答疑

在对数组有一定了解后我们会遇到一些问题&#xff0c;本文章将尽可能的讲解一些常见错误。 文章目录 1.数组名&#xff0c;&数组名分别代表什么&#xff1f;2.数组形式做形参时是传的整个数组还是首元素地址&#xff1f;3.为什么在主函数中用sizeof(arr)计算出的结果是整个…

登上抖音热搜榜:如何让你的内容火爆全网

在当今信息爆炸的时代&#xff0c;抖音已经成为了很多人获取信息、娱乐和社交的重要平台。每一天&#xff0c;都有大量的短视频在抖音上诞生&#xff0c;然而&#xff0c;只有少数幸运儿能够登上抖音热搜榜&#xff0c;成为万人瞩目的焦点。那么&#xff0c;如何让你的内容火爆…

【设计模式】解释器模式

文章目录 1.解释器模式定义2.解释器模式的角色3.解释器模式实战案例3.1.场景说明3.2.结构类图3.3.代码实现 4.解释器模式优缺点5.解释器模式适用场景6.解释器模式总结 主页传送门&#xff1a;&#x1f481; 传送 1.解释器模式定义 解析器模式&#xff08;Interpreter Pattern&a…

我国跨境电商行业研究报告(2022)

我国跨境电商行业研究报告 我国跨境电商规模突飞猛进&#xff0c;2022年进出口规模超2万亿元&#xff0c;2023年上半年跨境电商出口8210亿元&#xff0c;增长19.9%。全国跨境电商主体已超10万家&#xff0c;近年来涌现出一批上市公司&#xff0c;以及广州希音等全球独角兽企业。…