CS304961760的博客

原创 网页实现 音视频边缓存边播放 实例

原创 @rollup/plugin-html 详解

HTML 文件的标题为 "My App"，`` 标签上带有 `lang="en"` 属性，模板中的 `APP_VERSION` 参数为 "1.0.0"，生成的 HTML 文件的 `` 中带有一个 `` 标签，指定了视口大小为设备宽度，并且会对生成的 HTML 文件进行压缩和生成 sourcemap 文件。如果未指定模板，则会使用默认的模板。- `meta`: 指定生成的 HTML 文件的 `` 标签中的 `` 标签，可以是一个对象或者一个函数。

原创 html-webpack-plugin 配置

HTML Webpack Plugin 是一个非常有用的插件，它可以帮助你自动化地生成 HTML 文件，并将打包后的静态文件部署到指定的文件夹中。minify：指定要对 HTML 文件进行压缩和优化的一系列选项，包括删除空格、注释、多余的属性、script 和 link 标签中的 type 属性等。template: 'src/index.html', // 指定要使用的 HTML 模板文件。inject: 'body', // 将打包后的脚本注入到 HTML 文件的 body 中。

原创 compressorjs 参数

原创 Service Worker 实现页面缓存

原创 客户端 缓存php页面

原创 js 函数形式实例

原创 rollup-plugin-copy 配置

打包构建工具的插件，用于将指定的文件或目录从一个位置复制到另一个位置。

原创 rollup-plugin-html 参数

是一个用于处理 HTML 文件的 Rollup 插件。分别表示 HTML 文件的输入和输出。该参数可选，用于指定预处理器的函数。: 指定是否在输出中注入 HTML 页面的。的一些常用参数，更多参数请参考官方文档。

原创 rollup-html 插件使用

原创 rollup 解析html模板

原创 开发一个rollup插件

);},})\]/g, '');});})transform,

原创 Rollup 配置生成html插件

选项接受一个函数作为参数，该函数返回一个 HTML 字符串，其中包含了模板引擎渲染出来的动态数据。占位符来插入变量或表达式，从而生成动态的 HTML 内容。要在 Rollup 中生成 HTML 文件，可以使用。

原创 vite 不同环境配置

原创 vite 和 webpack 优缺点对比

内置支持 Vue.js：Vite 是由 Vue.js 团队开发的构建工具，因此它默认支持 Vue.js 和单文件组件，可以快速搭建 Vue.js 项目。简单的配置：Vite 的配置非常简单，只需要一个 vite.config.js 配置文件即可实现大多数功能。不支持所有类型的项目：Vite 主要面向 Vue.js 项目，因此在其他类型的项目中可能无法发挥出最佳效果。快速的开发者体验：Vite 可以实现快速的冷启动和热更新，使开发者可以迅速地获取反馈并进行调试。

原创 import from

原创 百度地图 获取城市编码 js

var cityArr = cityName.split("市");alert("无法获取该城市编码，请输入正确城市名称");getCityCode("北京", function(code) {console.log(code);// 输出: 110000。// city: 城市名称，callback: 回调函数。其中`BMap`对象为百度地图API提供的对象。// 根据城市名称匹配。

原创 js return ()[]

此语句将返回一个空的匿名数组，因为括号用于创建一个立即调用的函数表达式（IIFE），该表达式返回一个空白数组。函数为空，所以它不会更改任何内容，数组为空，因此它不会返回任何有意义的内容。值得注意的是，这段代码有点不寻常，而且有更简单的编写方法（例如，只返回一个空的数组文字）。//现在myArray是一个空数组，以后可以使用。//调用函数并将空数组分配给变量。

原创 箭头函数 用法

箭头函数（Arrow Function）是 ES6 新增的函数，它的语法比较简洁，大大减少了 JavaScript 代码量。+ES6 中箭头函数里的 this 指向的是外围作用域，而不是指向调用者，因此 this 在箭头函数中是不会改变的。+### 4、简化 Promise。+### 3、this 指向。+### 2、简化回调函数。+### 1、简化函数。

原创 svelte spawn 配置跨域

在 Svelte 应用程序中，可以在 Web 服务器中添加子进程目录和 `spawn` 配置。此外，应用程序的 `rollup.config.js` 文件也需要进行配置，以使 Svelte 应用程序可以使用子进程来获取数据。在这个例子中，我们使用了 `svelte-spawn` 库来启动子进程，执行 `node` 和 `server.js` 脚本文件，并从中获取数据。在 Svelte 应用程序中，如果需要使用跨域请求，可以在 Web 服务器配置中添加跨域相关的配置。

原创 svelte axios 项目搭建 客户端接口跨域

总之，在 Svelte 中使用 Axios 发送跨域请求需要在后端服务中添加跨域设置。在这个示例代码中，我们使用了 `cors` 中间件来添加跨域请求的设置，实现跨域请求。要解决 Svelte 中的 Axios 请求跨域问题，可以在后端服务中添加跨域设置。在这个示例代码中，我们使用了 Axios 来请求服务器中的 `/api/data` 路由，获取了返回的数据。注意到我们使用了 `` 来代表服务器地址，如果您的服务器地址不同，请修改对应的地址。

原创 svelte 配置跨域

Svelte 是一个轻量级的 JavaScript 框架，用于构建 Web 应用程序，它本身并不提供跨域相关的配置。然而，Svelte 的应用程序是标准的 Web 应用程序，因此，可以使用 Web 服务器配置来解决跨域问题。在 `app.get` 中添加了路由配置，用于返回 index.html 文件和其他资源文件。在上面的示例中，静态资源存储在 `public` 目录中。如果您需要在 Svelte 应用程序中使用跨域请求，可以在 Web 服务器配置中添加跨域配置。

原创 rollup-plugin-serve 配置跨域

如果您要在 `rollup-plugin-serve` 中配置跨域请求，需要在配置中添加中间件来解决。在这个例子中，我们将使用 `express` 中间件来配置跨域请求。在这里，我们添加了一个自定义的 `before` 函数，用于向 `express` 应用程序添加跨域请求中间件。总之，通过添加中间件到 `rollup-plugin-serve` 中，我们可以在本地开发过程中解决跨域请求问题。以上示例中，`before` 函数被传递给 `serve` 插件，用于在启动服务器之前将其添加到应用程序中。

原创 Rollup 配置文件

在以上示例中，我们使用常见的 Rollup 插件：`@rollup/plugin-node-resolve` 和 `@rollup/plugin-commonjs` 插件进行模块解析与转换，`@rollup/plugin-babel` 插件进行 JavaScript 代码转换，`rollup-plugin-terser` 插件进行代码压缩。- `input`：设置入口文件的路径，即您希望打包的 JavaScript 文件的位置。- `output`：指定输出目录和文件名称以及要生成的代码格式。

原创 rollup-plugin-serve 配置

rollup-plugin-serve` 是一个 Rollup 插件，用于在开发过程中充当本地 Web 服务器。默认情况下，`rollup-plugin-serve` 将使用您配置的端口号和主机名，在本地启动一个 Web 服务器，并提供指定目录的文件访问。在这个例子中，我们在 Rollup 配置文件中添加了 `rollup-plugin-serve` 插件，并提供了一些配置选项。总之，`rollup-plugin-serve` 可以令您的开发过程更加高效，有效的加快应用程序的开发过程，并提高开发效率。

原创 js 多个字符串对比不同

以上代码中的 `diffStrings` 函数接收任意数量的字符串参数，并遍历每个字符串的字符进行比较。`diffs` 数组用于记录所有字符串不同之处的位置和值。最后返回 `diffs` 数组，包含所有字符串不同之处的位置和值。可以使用 `split` 方法和 `forEach` 方法来遍历每个字符串的字符，比较每个字符的值是否相等。如果出现不同，则记录下不同字符所在的位置，最后输出所有字符串不同之处的位置和值。// 比较字符值是否相等，如果不等则记录下不同之处的位置和值。// 获取当前位置的字符。

原创 js 多个字符串对比留痕

在 JavaScript 中，要在多个字符串之间进行对比并输出留痕，可以使用 Diff算法（差异算法）来实现。为了在多个字符串之间进行对比，可以将一些较短的字符串替换为长字符串，并在长字符串上执行 Diff算法 计算留痕。在这个例子中，首先通过遍历每个字符串，将较短的字符串替换为长字符串。需要注意的是，Diff算法 可以增强字符串对比的精度，但在字符串较长的情况下，它也可能会产生很多无关紧要的变化，这时需要使用更高级别的算法来过滤掉无关紧要的变化。// 遍历每个字符串，将较短的字符串替换为长字符串。

原创 rollup.config.js 配置详解

rollup.config.js` 还有很多配置项，如 `external`、`watch`、`strictDeprecations` 等，大家可以根据需求自行添加或修改。format: 'umd', // 输出格式，支持 'amd', 'cjs', 'es', 'iife' 或 'umd'name: 'myModule', // 当输出格式为 'umd' 或 'iife' 时，对应的全局变量名。1. `input`：入口文件地址，默认为 `src/index.js`。：JavaScript 压缩插件。

原创 rollup-plugin-clear

用于指定要清空的目录或文件。可以传递一个数组，其中的每个元素代表一个要清空的目录或文件，也可以传递一个对象数组，用于更详细地指定要清空的目录或文件。`rollup-plugin-clear` 插件用于在构建之前清空指定的目录或文件。以上是 `rollup-plugin-clear` 可用的参数、以及一个使用示例。如果您需要在构建之前清空文件或目录，可以考虑使用此插件。- 类型: `string[] | object[]`// 是否在清空后提示确认。此配置将清空名为 `dist` 的目录。

原创 rollup-plugin-cleanup

以上是 `rollup-plugin-cleanup` 可用的参数。您可以根据需要自定义这些参数，并将其添加到 `rollup.config.js` 中来清理、优化和压缩您的 JavaScript 代码。`rollup-plugin-cleanup` 是一个用于清理、优化和压缩 JavaScript 代码的 Rollup 插件。例如，如果您需要处理 `.jsx` 文件，则可以将 `extensions` 设置为 `['.js', '.jsx']`。- 默认值: `['.js']`- 默认值: `true`

原创 rollup-plugin-css-only 参数

但在某些情况下，例如在使用服务端渲染时，您可能需要将 CSS 样式文件分离出来，这时就可以使用 `rollup-plugin-css-only` 插件了。例如，如果您要将 CSS 样式输出到 `public` 文件夹中的 `styles.css` 文件中，则可以将 `output` 设置为 `'public/styles.css'`。通过以上参数，您可以完全控制 `rollup-plugin-css-only` 插件的行为，并将 CSS 样式文件输出到所需的位置。- 默认值: `[]`

原创 rollup output 参数

例如，如果您要将代码输出到 `public` 文件夹中的 `bundle.js` 文件中，则可以将 `output.file` 设置为 `'public/bundle.js'`。如果您将 `output.dir` 设置为 `'public'`，则 Rollup 将会在 `public` 目录下生成所有生成文件。您可以根据需要自定义这些参数，并将其添加到 `rollup.config.js` 文件中来输出您的打包结果。在 Rollup 中，`output` 参数用于指定要输出的文件的位置和格式。

原创 @rollup/plugin-html 参数

@rollup/plugin-html` 是一个用于生成 HTML 文件的插件。如果您指定了 HTML 模板文件，则 `@rollup/plugin-html` 会将打包生成的 JavaScript 文件插入到该模板文件中，生成最终的 HTML 文件。例如，如果资源文件位于 `public/assets` 目录中，则可以将 `publicPath` 设置为 `/assets/`，从而在 HTML 文件中的资源文件引用路径中添加前缀 `/assets/`。- 默认值: `'index.html'`

原创 svelte 输出文件

这个 `rollup.config.js` 文件告诉 Rollup 来打包 `src/main.js` 文件，并将打包后的文件存放在 `public/bundle.js` 中。打包完成后，您可以在 `public/bundle.js` 文件中找到打包后的代码。该文件就是您的 Svelte 应用程序的输出文件，可以将它部署到服务器上。在 Svelte 中，要将项目打包输出到静态文件中，可以使用 Rollup 进行打包。// 开启 dev 模式以支持调试。

原创 @rollup/plugin-terser 用法

@rollup/plugin-terser` 是一个用于压缩 JavaScript 代码的插件。通过以上步骤，您现在已经可以使用 `@rollup/plugin-terser` 插件来压缩 JavaScript 代码了。2. 在 `rollup.config.js` 文件中导入 `@rollup/plugin-terser`1. 安装 `@rollup/plugin-terser` 插件。3. 在 `plugins ` 中添加 `terser` 插件。4. 配置 `terser` 插件。

原创 svelte spawn 接口跨域

在这个示例代码中，我们通过 `svelte-spawn` 库来发送请求，使用 `curl` 命令向 `localhost:3000/api/data` 发送请求，从而获得数据。通过添加跨域请求配置，我们可以在 Svelte 应用程序中使用 `svelte-spawn` 来处理跨域请求，实现前后端之间的数据交互。如果您在使用 `svelte-spawn` 库的过程中遇到了跨域请求的问题，可以考虑在您的服务器端添加跨域请求配置。// 处理跨域请求，并向前端发送数据。

原创 Rollup 配置文件

在以上示例中，我们使用常见的 Rollup 插件：`@rollup/plugin-node-resolve` 和 `@rollup/plugin-commonjs` 插件进行模块解析与转换，`@rollup/plugin-babel` 插件进行 JavaScript 代码转换，`rollup-plugin-terser` 插件进行代码压缩。- `input`：设置入口文件的路径，即您希望打包的 JavaScript 文件的位置。- `output`：指定输出目录和文件名称以及要生成的代码格式。

原创 rollup 配置跨域

Rollup 可以通过一些配置来解决跨域问题。通过添加 `devServer` 配置项，我们可以在 Rollup 应用程序中解决跨域问题，从而更轻松地开发和测试应用程序。`contentBase` 指定静态文件目录，`host` 和 `port` 分别指定开发服务器的主机名和端口号。在我们的 Rollup 应用程序中，可以使用 `/api` 路径来加载模块，而不需要担心跨域问题。在这个例子中，我们使用 `devServer` 配置项来设置一个代理，将 `` 中运行 Rollup 应用程序，并从 `

原创 ios webview 引用wap页面，第一次访问正常 后台重新拉起后白页

但是，当您重新拉起应用程序并重新访问页面时，缓存可能会导致页面出现问题。总之，当您在 iOS 的 WebView 中引入一个 WAP 页面，并在重新拉起应用程序后出现页面白屏时，可能是多种问题的结果。因此，需要检查应用程序中的后台任务，并确保它们与应用程序重新启动时的状态兼容。如果应用程序在后台运行时进行了一些操作，这可能会导致主线程被锁定，从而导致页面白屏等问题。因此，要在后台线程中执行任何长时间运行的任务。iOS 的 WebView 在引入 WAP 页面后，后台重新拉起应用程序可能会出现页面白屏。