vite面試題及詳細答案120題（01-30）

《前后端面試題》專欄集合了前后端各個知識模塊的面試題，包括html，javascript，css，vue，react，java，Openlayers，leaflet，cesium，mapboxGL，threejs，nodejs，mangoDB，MySQL，Linux… 。

前后端面試題-專欄總目錄

在這里插入圖片描述

文章目錄

  • 一、本文面試題目錄
      • 1. 什么是Vite？它和其他前端構建工具的區別是什么？
      • 2. Vite的主要特性有哪些？
      • 3. Vite的劣勢是什么？
      • 4. Vite和Webpack的區別是什么？
      • 5. Vite和Rollup的關系是怎樣的？
      • 6. Vite的開發服務器是如何工作的？
      • 7. Vite的生產環境構建是如何工作的？
      • 8. Vite如何利用瀏覽器原生ES模塊？
      • 9. Vite的依賴預構建是如何實現的？
      • 10. Vite中如何配置別名（alias）？
      • 11. Vite中如何配置環境變量？
      • 12. Vite中.env文件的作用是什么？
      • 13. Vite中如何使用不同的模式（mode）？
      • 14. Vite中如何處理CSS？
      • 15. Vite中如何使用CSS預處理器（Sass, Less, Stylus）？
      • 16. Vite中如何使用CSS Modules？
      • 17. Vite中如何使用PostCSS？
      • 18. Vite中如何處理靜態資源？
      • 19. Vite中如何配置構建輸出路徑？
      • 20. Vite中如何進行代碼分割？
      • 21. Vite中如何配置多入口？
      • 22. Vite的構建優化有哪些方法？
      • 23. Vite的插件機制是如何工作的？
      • 24. Vite中如何編寫一個插件？
      • 25. Vite中常用的插件有哪些？
      • 26. Vite中如何使用TypeScript？
      • 27. Vite中如何處理Vue單文件組件？
      • 28. Vite中如何處理React組件？
      • 29. Vite中如何使用JSX/TSX？
      • 30. Vite中如何進行單元測試？
  • 二、120道面試題目錄列表

一、本文面試題目錄

1. 什么是Vite？它和其他前端構建工具的區別是什么？

Vite是一個由尤雨溪開發的前端構建工具，旨在提供更快的開發體驗。與傳統構建工具（如Webpack）不同，Vite基于原生ES模塊（ES Modules），在開發環境中無需打包即可直接運行代碼，大大提高了冷啟動和熱更新速度。

主要區別：

  • 冷啟動速度：Vite無需等待整個應用打包，啟動時間接近瞬時；而Webpack需要先構建整個應用。
  • 模塊處理方式：Vite在開發時利用瀏覽器原生ES模塊支持，按需加載；Webpack通過打包將所有模塊合并為一個或多個bundle。
  • 熱更新（HMR）：Vite的HMR速度更快，且通常能保持組件狀態；Webpack的HMR可能需要重新編譯部分代碼。

2. Vite的主要特性有哪些？

  • 極速冷啟動：基于瀏覽器原生ES模塊，無需打包直接啟動。
  • 即時熱更新（HMR）：模塊熱替換速度極快，且不丟失組件狀態。
  • 智能依賴預構建：使用esbuild預構建依賴，提高加載速度。
  • 按需編譯：僅在瀏覽器請求時編譯模塊，而非一次性處理所有代碼。
  • 內置對多種格式的支持：如TypeScript、JSX、CSS預處理器等。
  • 優化的生產構建：使用Rollup生成優化后的靜態資源。
  • 插件系統：可擴展的插件接口，支持各種功能擴展。

3. Vite的劣勢是什么？

  • 生態系統成熟度：相比Webpack，Vite的插件生態可能不夠完善，某些特定場景的解決方案可能較少。
  • 復雜配置支持：對于非常復雜的項目結構或特殊需求，Vite的配置可能不如Webpack靈活。
  • 生產環境構建：雖然Vite在開發環境表現出色，但生產環境仍依賴Rollup，對于某些極端復雜的打包需求，可能不如Webpack全面。
  • 瀏覽器兼容性：由于依賴原生ES模塊，Vite在舊版瀏覽器中的支持較差，需要額外配置。

4. Vite和Webpack的區別是什么？

特性ViteWebpack
構建方式開發時基于ES模塊，按需加載先打包所有模塊再運行
冷啟動時間接近瞬時隨項目大小增長
熱更新速度極快，通常保持組件狀態較慢，可能需要重新編譯
依賴處理使用esbuild預構建依賴使用loader和plugin處理依賴
生產環境打包使用Rollup直接使用Webpack
配置復雜度相對簡單復雜，需要大量配置
生態系統快速發展，但不如Webpack成熟非常成熟，幾乎支持所有場景

5. Vite和Rollup的關系是怎樣的？

Vite在生產環境使用Rollup作為打包工具，而在開發環境則使用基于ES模塊的輕量級服務器。具體關系：

  • 開發環境：Vite不使用Rollup，而是直接利用瀏覽器原生ES模塊支持，通過中間件處理模塊導入和轉換。
  • 生產環境：Vite使用Rollup進行打包，默認配置已優化，但可通過build.rollupOptions自定義。
  • 插件兼容性：大多數Rollup插件可直接在Vite中使用，通過vite-plugin-rollup適配器。

6. Vite的開發服務器是如何工作的？

Vite開發服務器的工作流程：

  1. 啟動服務器：基于原生ES模塊，無需打包。
  2. 依賴預構建：使用esbuild預構建第三方依賴，將CommonJS/UMD轉換為ES模塊。
  3. 模塊請求處理：攔截瀏覽器的模塊請求，動態轉換代碼（如TypeScript、JSX）。
  4. 模塊解析：處理裸模塊導入（如import 'vue'），轉換為正確的路徑。
  5. HMR支持：實現模塊熱更新，通過WebSocket與瀏覽器通信。
  6. 靜態資源處理：直接提供靜態資源，支持按需編譯。

7. Vite的生產環境構建是如何工作的？

Vite在生產環境使用Rollup進行構建：

  1. 配置合并：合并Vite默認配置和用戶自定義的build.rollupOptions。
  2. 代碼轉換：使用各種插件處理代碼（如TypeScript、JSX轉換）。
  3. 依賴處理：將依賴和應用代碼分離，生成優化的chunk。
  4. 代碼分割：基于動態導入或路由進行代碼分割，提高加載性能。
  5. 資源處理：處理靜態資源（圖片、字體等），生成哈希文件名。
  6. 壓縮和優化：壓縮JavaScript、CSS代碼，生成sourcemap。
  7. 輸出文件：將優化后的資源輸出到指定目錄。

8. Vite如何利用瀏覽器原生ES模塊？

Vite通過以下方式利用原生ES模塊：

  1. 直接提供ES模塊：開發服務器直接返回符合ES模塊規范的JavaScript文件。
  2. 處理裸模塊導入：將import 'vue'轉換為import '/node_modules/vue/dist/vue.esm-bundler.js'。
  3. 動態模塊轉換：在瀏覽器請求時，動態轉換非JavaScript模塊（如TypeScript、CSS）為ES模塊。
  4. 按需加載：僅在瀏覽器請求時加載模塊，無需預打包整個應用。

示例：

// 源代碼
import { createApp } from 'vue';
import App from './App.vue';// Vite處理后，瀏覽器實際請求的代碼
import { createApp } from '/node_modules/vue/dist/vue.esm-bundler.js';
import App from '/src/App.vue?vue&type=script&lang=js';

9. Vite的依賴預構建是如何實現的？

Vite使用esbuild預構建依賴的流程：

  1. 掃描導入：分析項目入口文件，提取所有依賴（裸模塊導入）。
  2. esbuild轉換：使用esbuild將CommonJS/UMD模塊轉換為ES模塊。
  3. 緩存結果：將預構建的依賴緩存到node_modules/.vite目錄。
  4. 優化加載：預構建后的依賴作為單個模塊提供，減少瀏覽器請求。

配置示例（vite.config.js）：

export default {optimizeDeps: {include: ['lodash-es', 'axios'], // 指定需要預構建的依賴exclude: ['some-lib'], // 排除某些依賴不進行預構建},
};

10. Vite中如何配置別名（alias）？

在vite.config.js中使用resolve.alias配置別名：

import { defineConfig } from 'vite';export default defineConfig({resolve: {alias: {'@': '/src', // 將@映射到src目錄'components': '/src/components', // 自定義別名},},
});

使用示例：

// 原路徑
import MyComponent from '../../components/MyComponent.vue';// 使用別名后
import MyComponent from '@/components/MyComponent.vue';
No.大劍師精品GIS教程推薦
0地圖渲染基礎- 【WebGL 教程】 - 【Canvas 教程】 - 【SVG 教程】
1Openlayers 【入門教程】 - 【源代碼+示例 300+】
2Leaflet 【入門教程】 - 【源代碼+圖文示例 150+】
3MapboxGL【入門教程】 - 【源代碼+圖文示例150+】
4Cesium 【入門教程】 - 【源代碼+綜合教程 200+】
5threejs【中文API】 - 【源代碼+圖文示例200+】
6Shader 編程 【圖文示例 100+】

11. Vite中如何配置環境變量？

Vite通過.env文件和import.meta.env訪問環境變量：

  1. 創建環境文件：在項目根目錄創建.env（通用）、.env.development（開發環境）、.env.production（生產環境）。
  2. 定義變量：變量名必須以VITE_開頭。
    VITE_API_URL=https://api.example.com
VITE_APP_TITLE=My App
  3. 訪問變量：在代碼中使用import.meta.env.VITE_API_URL。

12. Vite中.env文件的作用是什么？

.env文件用于存儲環境變量，支持以下特性：

  • 環境特定配置：通過.env.development、.env.production等文件為不同環境定義變量。
  • 變量前綴：只有以VITE_開頭的變量會被暴露給客戶端代碼。
  • 優先級：環境特定文件 > 通用文件，命令行變量 > 文件變量。

示例：

# .env.development
VITE_API_URL=http://localhost:3000/api# .env.production
VITE_API_URL=https://api.production.com

13. Vite中如何使用不同的模式（mode）？

Vite通過mode參數區分不同環境：

  1. 內置模式：development（開發）和production（生產）。
  2. 自定義模式：可以定義其他模式（如test、staging）。
  3. 指定模式：通過命令行參數或配置文件指定。

命令行示例：

# 使用development模式（默認）
npm run dev# 使用production模式
npm run build# 使用自定義模式
vite build --mode staging

配置文件示例（vite.config.js）：

export default defineConfig(({ mode }) => {if (mode === 'staging') {return {base: '/staging/',// 其他配置};}return {// 默認配置};
});

14. Vite中如何處理CSS？

Vite內置對CSS的支持，包括：

  1. 直接導入：在JavaScript中導入CSS文件。
    import './style.css';
  2. CSS Modules：通過.module.css文件名啟用。
    import styles from './style.module.css';
document.body.classList.add(styles.container);
  3. PostCSS：自動應用項目中的PostCSS配置（如postcss.config.js）。
  4. CSS預處理器：支持Sass、Less、Stylus等，需安裝相應依賴。
  5. CSS代碼分割：根據入口點和動態導入自動分割CSS。

15. Vite中如何使用CSS預處理器（Sass, Less, Stylus）？

  1. 安裝依賴：

    # Sass
npm install sass -D# Less
npm install less -D# Stylus
npm install stylus -D

  2. 直接使用：導入相應擴展名的文件（.scss、.less、.styl）。

    import './style.scss';

  3. 全局變量/混合：使用css.preprocessorOptions配置。

    export default defineConfig({css: {preprocessorOptions: {scss: {additionalData: `@import "@/styles/variables.scss";`}}}
});

16. Vite中如何使用CSS Modules？

  1. 命名約定：使用.module.css、.module.scss等擴展名。

  2. 導入和使用：

    // style.module.css
.container {padding: 20px;
}// App.js
import styles from './style.module.css';function App() {return <div className={styles.container}>Hello World</div>;
}

  3. 自定義生成的類名：在vite.config.js中配置：

    export default defineConfig({css: {modules: {localsConvention: 'camelCaseOnly', // 類名轉為駝峰generateScopedName: '[name]__[local]___[hash:base64:5]' // 自定義格式}}
});

17. Vite中如何使用PostCSS？

  1. 安裝PostCSS：

    npm install postcss postcss-loader -D

  2. 創建PostCSS配置文件（postcss.config.js）：

    module.exports = {plugins: {'postcss-preset-env': {}, // 自動添加瀏覽器前綴cssnano: {} // 壓縮CSS}
};

  3. 配置Vite（可選，通常會自動讀取PostCSS配置）：

    export default defineConfig({css: {postcss: {plugins: [// 直接在這里配置插件]}}
});

18. Vite中如何處理靜態資源？

Vite內置對多種靜態資源的支持：

  1. 直接導入：

    import imgUrl from './assets/image.png';
document.getElementById('logo').src = imgUrl;

  2. URL引用：在CSS或HTML中使用相對路徑。

    .logo {background-image: url('./assets/logo.png');
}

  3. 資源處理：

    • 小于build.assetsInlineLimit（默認4kb）的資源會被內聯為base64。
    • 其他資源會被復制到輸出目錄并生成哈希文件名。

  4. 特殊導入：

    import svgUrl from './logo.svg?url'; // 強制作為URL
import svgComponent from './logo.svg?component'; // 作為React/Vue組件導入

19. Vite中如何配置構建輸出路徑？

在vite.config.js中使用build.outDir配置：

export default defineConfig({build: {outDir: 'dist', // 默認輸出目錄assetsDir: 'assets', // 靜態資源目錄},
});

20. Vite中如何進行代碼分割？

Vite支持多種代碼分割方式：

  1. 動態導入（推薦）：

    // 按需加載模塊
button.addEventListener('click', async () => {const { heavyModule } = await import('./heavyModule.js');heavyModule();
});

  2. 多入口應用：

    export default defineConfig({build: {rollupOptions: {input: {main: '/index.html',about: '/about.html',},},},
});

  3. 共享模塊分割：Rollup會自動分割共享模塊，也可通過manualChunks配置：

    export default defineConfig({build: {rollupOptions: {output: {manualChunks: {vendor: ['lodash', 'axios'], // 將這些依賴單獨打包},},},},
});
No.大劍師精品GIS教程推薦
0地圖渲染基礎- 【WebGL 教程】 - 【Canvas 教程】 - 【SVG 教程】
1Openlayers 【入門教程】 - 【源代碼+示例 300+】
2Leaflet 【入門教程】 - 【源代碼+圖文示例 150+】
3MapboxGL【入門教程】 - 【源代碼+圖文示例150+】
4Cesium 【入門教程】 - 【源代碼+綜合教程 200+】
5threejs【中文API】 - 【源代碼+圖文示例200+】
6Shader 編程 【圖文示例 100+】

21. Vite中如何配置多入口？

在vite.config.js中配置Rollup的input選項：

import { defineConfig } from 'vite';
import { fileURLToPath, URL } from 'url';export default defineConfig({build: {rollupOptions: {input: {main: fileURLToPath(new URL('./index.html', import.meta.url)),admin: fileURLToPath(new URL('./admin.html', import.meta.url)),},},},
});

對應的HTML文件結構：

├── index.html
├── admin.html
└── src/├── main.js└── admin.js

22. Vite的構建優化有哪些方法？

  1. 代碼分割：使用動態導入或manualChunks配置。
  2. 壓縮代碼：生產環境默認啟用Terser壓縮。
  3. 移除console.log：通過Terser配置移除調試代碼。
  4. CDN加載外部資源：使用externals排除依賴，通過CDN加載。
  5. 圖片優化：使用image插件壓縮圖片。
  6. 預加載/預取：通過插件自動添加<link rel="preload">。
  7. 按需加載：動態導入非關鍵資源。
  8. 使用esbuild：通過esbuild選項進一步優化構建。

配置示例：

export default defineConfig({build: {minify: 'terser',terserOptions: {compress: {drop_console: true, // 移除consoledrop_debugger: true, // 移除debugger},},rollupOptions: {external: ['vue', 'react'], // 排除這些依賴output: {manualChunks: {vendor: ['lodash'], // 將lodash單獨打包},},},},
});

23. Vite的插件機制是如何工作的？

Vite插件基于Rollup插件接口，同時擴展了一些特定鉤子：

  1. 插件類型：

    • 通用插件：同時影響開發和生產環境。
    • 開發時插件：僅在開發環境生效。
    • 構建時插件：僅在生產環境生效。

  2. 核心鉤子：

    • config：修改Vite配置。
    • transform：轉換單個模塊內容。
    • configureServer：配置開發服務器。
    • handleHotUpdate：自定義HMR邏輯。

  3. 執行順序：插件按注冊順序執行，可通過enforce選項調整優先級。

24. Vite中如何編寫一個插件？

一個簡單的Vite插件結構：

// my-plugin.js
export default function myPlugin() {return {name: 'my-vite-plugin', // 插件名稱enforce: 'pre', // 執行優先級：'pre' | 'post'// 修改Vite配置config(config, { command }) {if (command === 'serve') {return {// 開發環境配置};}},// 轉換模塊內容transform(code, id) {if (id.endsWith('.js')) {// 修改JavaScript代碼return code.replace('console.log', '// console.log');}return code;},// 配置開發服務器configureServer(server) {server.middlewares.use((req, res, next) => {// 自定義中間件邏輯next();});},// 自定義HMR處理handleHotUpdate(ctx) {console.log('HMR update:', ctx.file);return [];},};
}

在vite.config.js中使用：

import myPlugin from './my-plugin';export default defineConfig({plugins: [myPlugin()],
});

25. Vite中常用的插件有哪些？

  1. 官方插件：

    • @vitejs/plugin-vue：Vue 3支持。
    • @vitejs/plugin-react：React支持。
    • @vitejs/plugin-legacy：舊版瀏覽器支持。

  2. 社區插件：

    • vite-plugin-pwa：漸進式Web應用支持。
    • vite-plugin-svg-icons：SVG圖標處理。
    • vite-plugin-compression：生產環境資源壓縮。
    • vite-plugin-eslint：集成ESLint。
    • unplugin-auto-import：自動導入API。
    • unplugin-vue-components：自動導入組件。
    • @rollup/plugin-alias：別名支持。
    • @rollup/plugin-json：JSON處理。

26. Vite中如何使用TypeScript？

Vite內置對TypeScript的支持，無需額外配置：

  1. 安裝依賴：

    npm install typescript @types/node -D

  2. 創建tsconfig.json：

    npx tsc --init

  3. 編寫TypeScript代碼：

    // src/main.ts
import { createApp } from 'vue';
import App from './App.vue';createApp(App).mount('#app');

  4. 配置選項（可選）：

    // vite.config.ts
import { defineConfig } from 'vite';export default defineConfig({esbuild: {// 配置esbuild轉換選項jsxFactory: 'h',jsxFragment: 'Fragment',},
});

27. Vite中如何處理Vue單文件組件？

  1. 安裝Vue插件：

    npm install @vitejs/plugin-vue -D

  2. 配置Vite：

    // vite.config.js
import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';export default defineConfig({plugins: [vue()],
});

  3. 編寫Vue組件：

    <!-- src/App.vue -->
<template><div class="hello"><h1>{{ msg }}</h1></div>
</template><script lang="ts">
import { defineComponent } from 'vue';export default defineComponent({setup() {return {msg: 'Hello Vue 3 + TypeScript + Vite',};},
});
</script>

28. Vite中如何處理React組件？

  1. 安裝React插件：

    npm install @vitejs/plugin-react -D

  2. 配置Vite：

    // vite.config.js
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';export default defineConfig({plugins: [react()],
});

  3. 編寫React組件：

    // src/App.jsx
import React from 'react';function App() {return (<div className="App"><h1>Hello React + Vite</h1></div>);
}export default App;

29. Vite中如何使用JSX/TSX？

Vite內置對JSX/TSX的支持，無需額外配置：

  1. React JSX：使用@vitejs/plugin-react插件。
  2. Vue JSX：安裝@vue/babel-plugin-jsx或使用@vitejs/plugin-vue-jsx。

示例（Vue JSX）：

// 安裝依賴
npm install @vitejs/plugin-vue-jsx -D// vite.config.js
import { defineConfig } from 'vite';
import vueJsx from '@vitejs/plugin-vue-jsx';export default defineConfig({plugins: [vueJsx()],
});// 組件中使用
import { defineComponent } from 'vue';export default defineComponent({setup() {return () => <h1>Hello Vue JSX</h1>;},
});

30. Vite中如何進行單元測試？

Vite項目常用的單元測試方案：

  1. Jest：

    • 安裝：npm install jest @types/jest ts-jest -D
    • 配置：創建jest.config.js
    module.exports = {preset: 'ts-jest',testEnvironment: 'jsdom',
};
    • 測試命令：npx jest

  2. Vitest（Vite官方推薦）：

    • 安裝：npm install vitest -D
    • 配置（vite.config.js）：
    import { defineConfig } from 'vite';export default defineConfig({test: {environment: 'jsdom',},
});
    • 編寫測試：
    // sum.test.js
import { describe, it, expect } from 'vitest';describe('sum test', () => {it('adds 1 + 2 to equal 3', () => {expect(1 + 2).toBe(3);});
});
    • 測試命令：npx vitest

二、120道面試題目錄列表

文章序號vite面試題120道
1vite面試題及詳細答案120道（01-30）
2vite面試題及詳細答案120道（31-60）
3vite面試題及詳細答案120道（61-90）
4vite面試題及詳細答案120道（91-120）

本文來自互聯網用戶投稿，該文觀點僅代表作者本人，不代表本站立場。本站僅提供信息存儲空間服務，不擁有所有權，不承擔相關法律責任。
如若轉載，請注明出處：http://www.pswp.cn/news/917729.shtml
繁體地址，請注明出處：http://hk.pswp.cn/news/917729.shtml
英文地址，請注明出處：http://en.pswp.cn/news/917729.shtml

如若內容造成侵權/違法違規/事實不符，請聯系多彩編程網進行投訴反饋email:809451989@qq.com，一經查實，立即刪除！

相關文章

Cesium學習（一）-基礎

Cesium學習（一）-基礎

Cesium是一個開源的JavaScript庫&#xff0c;專門用于創建3D地球和地圖可視化。它在GIS、航空航天、城市規劃等領域有廣泛應用。 Cesium核心特性3D地球可視化 基于WebGL的高性能3D渲染支持全球地形和影像數據準確的地球模型&#xff08;WGS84橢球體&#xff09;多維數據支持 時…
閱讀更多...
餓了么招java開發咯

餓了么招java開發咯

研發工程師-JAVA/Golang&#xff08;崗位信息已經過jobleap.cn授權&#xff0c;可以在CSDN發布&#xff09;餓了么 杭州收錄時間&#xff1a; 2025年08月05日職位描述1、參與基礎軟件的設計、開發和維護&#xff0c;如分布式中間件、DevOps平臺、應用監控系統等&#xff1b; 2…
閱讀更多...
java web 未完成項目，本來想做個超市管理系統，前端技術還沒學。前端是個簡單的html。后端接口比較完善。

java web 未完成項目，本來想做個超市管理系統，前端技術還沒學。前端是個簡單的html。后端接口比較完善。

代碼結構 超市管理系統/├── src/ │ ├── com/ │ │ └── zhang/ │ ├── documents.txt │ ├── documents_detail.txt │ ├── goods.txt │ ├── order.txt │ ├── order_detail.txt │ ├── role.txt │ ├── tb_test.txt │ …
閱讀更多...
R語言基礎圖像及部分調用函數

R語言基礎圖像及部分調用函數

R語言基礎圖像及部分調用函數 散點圖 散點圖是將所有的數據以點的形式展現在直角坐標系上&#xff0c;以顯示變量之間的相互影響程度&#xff0c;點的位置由變量的數值決定&#xff0c;每個點對應一個 X 和 Y 軸點坐標。 散點圖可以使用 plot() 函數來繪制 例子 x<-c(10,40)…
閱讀更多...
自由學習記錄（77）

自由學習記錄（77）

官方模版、、都不用了&#xff0c;記得之前用gitextension 的時候也好像有這種問題&#xff0c;也不知道怎么回事 用自己的就行了 網上說什么都沒用&#xff0c;還是要自己老實寫&#xff0c;配上截圖工具截屏目錄直接轉文字過去&#xff0c;其實字都不要打多少的 一張很深刻…
閱讀更多...
運動想象 (MI) 分類學習系列 (18) : MSVTNet

運動想象 (MI) 分類學習系列 (18) : MSVTNet

運動想象分類學習系列:用于基于腦電圖的運動圖像解碼的多尺度視覺轉換器神經網絡 0. 引言 1. 主要貢獻 2. 方法![在這里插入圖片描述](https://i-blog.csdnimg.cn/direct/65a03fcd4a9144f6a7324b0969fd9d4e.png#pic_center) 3. 結果 3.1 腦電圖數據預處理 3.2 解碼性能比較 3.3…
閱讀更多...
Spring 03 Web springMVC

Spring 03 Web springMVC

Springboot 常用 Spring MVC 實現 web 服務。 Spring MVC 請求處理流程圖片來自《Spring 實戰第四版》 瀏覽器請求首先被交給 DispatcherServlet 前端控制器。 DispatcherServlet 查詢處理器映射以決定將請求發送給哪個控制器。控制器處理業務邏輯后&#xff0c;向 DispatcherS…
閱讀更多...
大廠面試題

大廠面試題

線程池的狀態?回答:running->shutdown->stop->tidyng->TERMINATED 線程池狀態怎么流轉2. 回答:變成shutdown&#xff0c;執行shutdown()函數變成stop&#xff0c;執行shutdownnow函數 變成tining&#xff0c;所有任務已處理完 變成TERMINATED&#xff0c;線程池調…
閱讀更多...
達芬奇31-40

達芬奇31-40

快捷鍵C鼠標左鍵拖拽到節點上 A鼠標左鍵拖拽節點 復制到另一個圖層上Raw素材太哦調整為log方便調色磨皮中間調向左磨皮,向右變老找到丟失的高光磨皮后臉部高光消失,或不明顯,此時用亮度吸管工具找到臉部的高光,拉高中灰和亮部的Y值質感紋理增強器Tiny,Fine高頻細節(臉部)增強或…
閱讀更多...
dify

dify

一、SVG Logo Design ### 任務 我希望你充當圖像生成的提示生成器。 ### 任務描述 你的工作是提供詳細且富有創意的描述&#xff0c;以激發 AI 生成獨特而有趣的圖像。請記住&#xff0c;格式應遵循以下一般模式&#xff1a; <主要主題>, <主要主題的描述>, <背…
閱讀更多...
Mysql 實戰問題處理速通

Mysql 實戰問題處理速通

文章目錄創建賬號和授權查詢沒有主鍵的表統計每個庫大小前十張大表清理日志表Prepared statement needs to be re-preparedxtrabackup 問題鎖問題處理快速處理查詢事務等待和阻塞情況innodb_trxprocesslistdata_locksdata_lock_waitsmetadata_locksevents_statements_current其…
閱讀更多...
如何測量滾珠花鍵的旋轉方向間隙？

如何測量滾珠花鍵的旋轉方向間隙？

測量滾珠花鍵的旋轉方向間隙需要使用適當的工具&#xff0c;通常情況下&#xff0c;可以使用游標卡尺或外徑卡尺進行測量。這些工具可以準確地測量間隙的寬度和深度&#xff0c;并且可以輕松地記錄測量結果。手動檢測法&#xff1a;將滾珠花鍵固定在支架上&#xff0c;確保其可…
閱讀更多...
Android AppSearch 深度解析：現代應用搜索架構與實踐

Android AppSearch 深度解析：現代應用搜索架構與實踐

一、AppSearch 概述1.1 什么是 AppSearchAppSearch 是 Android Jetpack 組件庫中的一個現代化本地搜索框架&#xff0c;于 Android 12 (API level 31) 引入&#xff0c;旨在為 Android 應用提供高效、可靠的本地數據索引和搜索能力。與傳統的 SQLite 搜索方案相比&#xff0c;A…
閱讀更多...
使用公眾號的消息模板給關注用戶發消息

使用公眾號的消息模板給關注用戶發消息

&#x1f9d1; 博主簡介&#xff1a;CSDN博客專家&#xff0c;歷代文學網&#xff08;PC端可以訪問&#xff1a;https://literature.sinhy.com/#/?__c1000&#xff0c;移動端可微信小程序搜索“歷代文學”&#xff09;總架構師&#xff0c;15年工作經驗&#xff0c;精通Java編…
閱讀更多...
【盤古100Pro+開發板實驗例程】FPGA學習 | 3X3圖像矩陣生成 | 圖像實驗指導手冊

【盤古100Pro+開發板實驗例程】FPGA學習 | 3X3圖像矩陣生成 | 圖像實驗指導手冊

本原創文章由深圳市小眼睛科技有限公司創作&#xff0c;版權歸本公司所有&#xff0c;如需轉載&#xff0c;需授權并注明出處&#xff08;www.meyesemi.com) 1. 實驗簡介 實驗目的&#xff1a; 實現 3X3 圖像矩陣對應 9 個像素點圖像數據的讀取。 實驗環境&#xff1a; Wind…
閱讀更多...
【通用視覺框架】基于OpenCvSharp+WPF+YOLO開發的仿VisionMaster的通用視覺框架軟件，全套源碼，開箱即用

【通用視覺框架】基于OpenCvSharp+WPF+YOLO開發的仿VisionMaster的通用視覺框架軟件，全套源碼，開箱即用

【通用視覺框架】基于OpenCvSharpWPFYOLO開發的仿VisionMaster的通用視覺框架軟件&#xff0c;全套源碼&#xff0c;開箱即用 基于OpenCvSharp、WPF和YOLO的組合&#xff0c;構建一個兼具圖像處理能力、可視化交互和實時檢測的工業級視覺框架。其核心是將底層算法與上層界面無…
閱讀更多...
微信小程序轉Vue2組件智能提示詞

微信小程序轉Vue2組件智能提示詞

角色 小程序轉Vue2組件工程師&#xff08;ElementUI專精&#xff09; 核心能力 技術專長&#xff1a;作為世界頂尖前端工程師&#xff0c;專注于將小程序組件&#xff08;.wxml/.wxss/.js/.json&#xff09;精準轉換為Vue2ElementUI組件&#xff0c;轉換邏輯零偏差&#xff0c;…
閱讀更多...
JVM 學習總結

JVM 學習總結

文章目錄內存結構程序計數器什么是程序計數器&#xff1f;核心作用&#xff1a;為什么需要程序計數器&#xff1f;實現原理主要特點示例&#xff1a;PC 寄存器如何工作總結Java 虛擬機棧什么是 Java 虛擬機棧&#xff1f;棧幀的內部結構主要特點總結線程診斷本地方法棧堆堆內存…
閱讀更多...
目標檢測檢出率，誤檢率，ap，map等評估python代碼

目標檢測檢出率，誤檢率，ap，map等評估python代碼

1.deepseek版本import numpy as np from collections import defaultdictdef calculate_iou(box1, box2):"""計算兩個邊界框的交并比&#xff08;IoU&#xff09;:param box1: [x1, y1, x2, y2]:param box2: [x1, y1, x2, y2]:return: IoU"""# 計…
閱讀更多...
python的高校班級管理系統

python的高校班級管理系統

前端開發框架:vue.js 數據庫 mysql 版本不限 后端語言框架支持&#xff1a; 1 java(SSM/springboot)-idea/eclipse 2.NodejsVue.js -vscode 3.python(flask/django)–pycharm/vscode 4.php(thinkphp/laravel)-hbuilderx 數據庫工具&#xff1a;Navicat/SQLyog等都可以 在高校教…
閱讀更多...
最新文章

Copyright @ 2022~2023