docs: remove horizontal scrollbars in code blocks (vitejs#1702)

Author: jay-es

config/index.md

@@ -104,8 +104,9 @@ Vite はデフォルトでは `.env` ファイルをロードしないことに
 import { defineConfig, loadEnv } from 'vite'
 
 export default defineConfig(({ command, mode }) => {
-  // `mode` に基づいて現在の作業ディレクトリーにある env ファイルをロードする
-  // `VITE_` プレフィックスに関係なく全ての環境変数をロードするには、第 3 引数に '' を設定します
+  // `mode` に基づいて現在の作業ディレクトリーにある env ファイルをロードする。
+  // `VITE_` プレフィックスに関係なく全ての環境変数をロードするには、
+  // 第 3 引数に '' を設定します
   const env = loadEnv(mode, process.cwd(), '')
   return {
     // vite の設定

config/server-options.md

@@ -101,15 +101,21 @@ export default defineConfig({
 export default defineConfig({
   server: {
     proxy: {
-      // 文字列のショートハンド: http://localhost:5173/foo -> http://localhost:4567/foo
+      // 文字列のショートハンド:
+      // http://localhost:5173/foo
+      //   -> http://localhost:4567/foo
       '/foo': 'http://localhost:4567',
-      // オプションを使用: http://localhost:5173/api/bar-> http://jsonplaceholder.typicode.com/bar
+      // オプションを使用:
+      // http://localhost:5173/api/bar
+      //   -> http://jsonplaceholder.typicode.com/bar
       '/api': {
         target: 'http://jsonplaceholder.typicode.com',
         changeOrigin: true,
         rewrite: (path) => path.replace(/^\/api/, ''),
       },
-      // 正規表現を使用: http://localhost:5173/fallback/ -> http://jsonplaceholder.typicode.com/
+      // 正規表現を使用:
+      // http://localhost:5173/fallback/
+      //   -> http://jsonplaceholder.typicode.com/
       '^/fallback/.*': {
         target: 'http://jsonplaceholder.typicode.com',
         changeOrigin: true,
@@ -123,8 +129,11 @@ export default defineConfig({
           // プロキシは 'http-proxy' のインスタンスになります
         },
       },
-      // Web ソケット か socket.io をプロキシ化: ws://localhost:5173/socket.io -> ws://localhost:5174/socket.io
-      // `rewriteWsOrigin` を使用すると、プロキシが CSRF 攻撃に無防備なままになる可能性があるため、使用には注意してください。
+      // Web ソケット か socket.io をプロキシ化:
+      // ws://localhost:5173/socket.io
+      //   -> ws://localhost:5174/socket.io
+      // `rewriteWsOrigin` を使用すると、プロキシが CSRF 攻撃に無防備になる
+      // 可能性があるため、使用には注意してください。
       '/socket.io': {
         target: 'ws://localhost:5174',
         ws: true,
@@ -251,16 +260,17 @@ async function createServer() {
   // ミドルウェアモードで Vite サーバーを作成
   const vite = await createViteServer({
     server: { middlewareMode: true },
-    appType: 'custom', // ViteのデフォルトのHTMLを処理するミドルウェアを含めない
+    // Viteのデフォルトの HTML を処理するミドルウェアを含めない
+    appType: 'custom',
   })
   // vite の接続インスタンスをミドルウェアとして使用
   app.use(vite.middlewares)
 
   app.use('*', async (req, res) => {
     // `appType` が `'custom'` なので、ここでレスポンスを返すべきです。
-    // 注: `appType` が `'spa'` または `'mpa'` の際は、Vite に HTML リクエスト と 404 になる
-    // リクエストを処理するミドルウェアが含まれます。したがって、ユーザーのミドルウェアが
-    // 動作するためにはViteのミドルウェアよりも前に追加されるべきです。
+    // 注: `appType` が `'spa'` または `'mpa'` の際は、Vite に HTML リクエスト と
+    // 404 を処理するミドルウェアが含まれるため、ユーザーのミドルウェアが
+    // 動作するためには Vite のミドルウェアよりも前に追加されるべきです。
   })
 }
 

guide/api-environment-frameworks.md

@@ -22,7 +22,8 @@ export class RunnableDevEnvironment extends DevEnvironment {
 
 class ModuleRunner {
   /**
-   * 実行するURL。ルートからの相対的なファイルパス、サーバーパス、ID を受け付けます。
+   * 実行するURL。
+   * ルートからの相対的なファイルパス、サーバーパス、ID を受け付けます。
    * インスタンス化されたモジュールを返します (ssrLoadModule と同じ)
    */
   public async import(url: string): Promise<Record<string, any>>
@@ -52,20 +53,21 @@ const server = await createServer({
   appType: 'custom',
   environments: {
     server: {
-      // デフォルトでは、開発中はモジュールは vite 開発サーバーと同じプロセスで実行されます
+      // デフォルトでは、モジュールは vite サーバーと同じプロセスで実行されます
     },
   },
 })
 
-// TypeScript では、これを RunnableDevEnvironment にキャストするか、ランナーへのアクセスを
-// 保護するために "isRunnableDevEnvironment" 関数を使用する必要があるかもしれません
+// TypeScript でこれを RunnableDevEnvironment にキャストするか、ランナーへのアクセスを
+// 保護するために isRunnableDevEnvironment を使用する必要があるかもしれません
 const environment = server.environments.node
 
 app.use('*', async (req, res, next) => {
   const url = req.originalUrl
 
   // 1. index.html を読み込む
-  let template = fs.readFileSync(path.resolve(__dirname, 'index.html'), 'utf-8')
+  const indexHtmlPath = path.resolve(__dirname, 'index.html')
+  let template = fs.readFileSync(indexHtmlPath, 'utf-8')
 
   // 2. Vite HTML 変換を適用します。これにより、Vite HMR クライアントが挿入され、
   //    Vite プラグインからの HTML 変換も適用されます。
@@ -112,7 +114,7 @@ const server = createServer()
 const ssrEnvironment = server.environment.ssr
 const input = {}
 
-const { createHandler } = await ssrEnvironment.runner.import('./entrypoint.js')
+const { createHandler } = await ssrEnvironment.runner.import('./entry.js')
 const handler = createHandler(input)
 const response = handler(new Request('/'))
 
@@ -186,10 +188,10 @@ function vitePluginVirtualIndexHtml(): Plugin {
         let html: string
         if (server) {
           this.addWatchFile('index.html')
-          html = await fs.promises.readFile('index.html', 'utf-8')
+          html = fs.readFileSync('index.html', 'utf-8')
           html = await server.transformIndexHtml('/', html)
         } else {
-          html = await fs.promises.readFile('dist/client/index.html', 'utf-8')
+          html = fs.readFileSync('dist/client/index.html', 'utf-8')
         }
         return `export default ${JSON.stringify(html)}`
       }

guide/api-environment-plugins.md

@@ -135,14 +135,15 @@ const UnoCssPlugin = () => {
   // 共有グローバル状態
   return {
     buildStart() {
-      // WeakMap<Environment,Data>, this.environment を使って環境ごとの状態を初期化
+      // WeakMap<Environment,Data>, this.environment を使って
+      // 環境ごとの状態を初期化
     },
     configureServer() {
       // グローバルフックを通常どおり使用
     },
     applyToEnvironment(environment) {
       // このプラグインがこの環境でアクティブになる必要がある場合は true を返します
-      // この関数が提供されていない場合、プラグインはすべての環境でアクティブになります
+      // フックが使用されていない場合、プラグインはすべての環境でアクティブになります
     },
     resolveId(id, importer) {
       // このプラグインが適用される環境に対してのみ呼び出されます

guide/api-environment-runtimes.md

@@ -84,7 +84,11 @@ Vite モジュールランナーは、最初に Vite プラグインで処理す
 ```ts
 import { DevEnvironment, RemoteEnvironmentTransport } from 'vite'
 
-function createWorkerdDevEnvironment(name: string, config: ResolvedConfig, context: DevEnvironmentContext) {
+function createWorkerdDevEnvironment(
+  name: string,
+  config: ResolvedConfig,
+  context: DevEnvironmentContext
+) {
   const hot = /* ... */
   const connection = /* ... */
   const transport = new RemoteEnvironmentTransport({
@@ -120,20 +124,21 @@ export class ModuleRunner {
     private debug?: ModuleRunnerDebugger,
   ) {}
   /**
-   * 実行するURL。ルートからの相対的なファイルパス、サーバーパス、ID を受け付けます。
+   * 実行するURL。
+   * ルートからの相対的なファイルパス、サーバーパス、ID を受け付けます。
    */
   public async import<T = any>(url: string): Promise<T>
   /**
    * HMR リスナーを含むすべてのキャッシュをクリアします。
    */
   public clearCache(): void
   /**
-   * すべてのキャッシュをクリアし、すべての HMR リスナーを削除し、ソースマップのサポートをリセットします。
+   * 全キャッシュをクリア、全 HMR リスナーを削除、ソースマップサポートをリセットします。
    * このメソッドは HMR 接続を停止しません。
    */
   public async close(): Promise<void>
   /**
-   * `close()` メソッドを呼び出してランナーを終了した場合は `true` を返します。
+   * `close()` を呼び出してランナーを終了した場合は `true` を返します。
    */
   public isClosed(): boolean
 }
@@ -174,9 +179,12 @@ export interface ModuleRunnerOptions {
    */
   transport: RunnerTransport
   /**
-   * ソースマップの解決方法を設定します。`process.setSourceMapsEnabled` が使用可能な場合は `node` を優先します。
-   * それ以外の場合は、デフォルトで `prepareStackTrace` を使用し、`Error.prepareStackTrace` メソッドをオーバーライドします。
-   * Vite によって処理されなかったファイルのファイル内容とソースマップの解決方法を設定するオブジェクトを提供できます。
+   * ソースマップの解決方法を設定します。
+   * `process.setSourceMapsEnabled` が使用可能な場合は `node` を優先します。
+   * それ以外の場合は、デフォルトで `prepareStackTrace` を使用し、
+   * `Error.prepareStackTrace` メソッドをオーバーライドします。
+   * Vite によって処理されなかったファイルのファイル内容とソースマップの解決方法を設定する
+   * オブジェクトを提供できます。
    */
   sourcemapInterceptor?:
     | false
@@ -199,7 +207,8 @@ export interface ModuleRunnerOptions {
         logger?: false | HMRLogger
       }
   /**
-   * カスタムモジュールキャッシュ。指定されていない場合は、モジュールランナーインスタンスごとに個別のモジュールキャッシュが作成されます。
+   * カスタムモジュールキャッシュ。指定されていない場合は、モジュールランナーの
+   * インスタンスごとに個別のモジュールキャッシュが作成されます。
    */
   evaluatedModules?: EvaluatedModules
 }
@@ -344,7 +353,8 @@ export interface ModuleRunnerHMRConnection {
   send(payload: HotPayload): void
   /**
    * この接続が更新をトリガーしたときに HMR がどのように処理されるかを設定します。
-   * このメソッドは、接続が HMR 更新のリッスンを開始し、受信時にこのコールバックを呼び出すことを想定しています。
+   * このメソッドは、接続が HMR 更新のリッスンを開始し、受信時にこのコールバックを
+   * 呼び出すことを想定しています。
    */
   onUpdate(callback: (payload: HotPayload) => void): void
 }

guide/build.md

@@ -337,7 +337,9 @@ experimental: {
     if (type === 'public') {
       return 'https://www.domain.com/' + filename
     } else if (path.extname(hostId) === '.js') {
-      return { runtime: `window.__assetsPath(${JSON.stringify(filename)})` }
+      return {
+        runtime: `window.__assetsPath(${JSON.stringify(filename)})`
+      }
     } else {
       return 'https://cdn.domain.com/assets/' + filename
     }