LM Studio Integration

.env.example

@@ -40,5 +40,10 @@ OPENAI_LIKE_API_KEY=
 # You only need this environment variable set if you want to use Mistral models
 MISTRAL_API_KEY=
 
+# Get LMStudio Base URL from LM Studio Developer Console
+# Make sure to enable CORS
+# Example: http://localhost:1234
+LMSTUDIO_API_BASE_URL=
+
 # Include this environment variable if you want more logging for debugging locally
 VITE_LOG_LEVEL=debug

app/components/chat/BaseChat.tsx

@@ -48,6 +48,9 @@ const ModelSelector = ({ model, setModel, modelList, providerList }) => {
         <option key="OpenAILike" value="OpenAILike">
           OpenAILike
         </option>
+        <option key="LMStudio" value="LMStudio">
+          LMStudio
+        </option>
       </select>
       <select
         value={model}

app/lib/.server/llm/api-key.ts

@@ -34,6 +34,8 @@ export function getBaseURL(cloudflareEnv: Env, provider: string) {
   switch (provider) {
     case 'OpenAILike':
       return env.OPENAI_LIKE_API_BASE_URL || cloudflareEnv.OPENAI_LIKE_API_BASE_URL;
+    case 'LMStudio':
+      return env.LMSTUDIO_API_BASE_URL || cloudflareEnv.LMSTUDIO_API_BASE_URL || "http://localhost:1234";
     case 'Ollama':
         return env.OLLAMA_API_BASE_URL || cloudflareEnv.OLLAMA_API_BASE_URL || "http://localhost:11434";
     default:

app/lib/.server/llm/model.ts

@@ -80,6 +80,14 @@ export function getOpenRouterModel(apiKey: string, model: string) {
   return openRouter.chat(model);
 }
 
+export function getLMStudioModel(baseURL: string, model: string) {
+  const lmstudio = createOpenAI({
+    baseUrl: 'http://localhost:1234/v1',
+  });
+
+  return lmstudio(model);
+}
+
 export function getModel(provider: string, model: string, env: Env) {
   const apiKey = getAPIKey(env, provider);
   const baseURL = getBaseURL(env, provider);
@@ -94,13 +102,15 @@ export function getModel(provider: string, model: string, env: Env) {
     case 'OpenRouter':
       return getOpenRouterModel(apiKey, model);
     case 'Google':
-      return getGoogleModel(apiKey, model)
+      return getGoogleModel(apiKey, model);
     case 'OpenAILike':
       return getOpenAILikeModel(baseURL,apiKey, model);
     case 'Deepseek':
-      return getDeepseekModel(apiKey, model)
+      return getDeepseekModel(apiKey, model);
     case 'Mistral':
       return  getMistralModel(apiKey, model);
+    case 'LMStudio':
+      return getLMStudioModel(baseURL, model);
     default:
       return getOllamaModel(baseURL, model);
   }

app/utils/constants.ts

@@ -86,10 +86,28 @@ async function getOpenAILikeModels(): Promise<ModelInfo[]> {
  }
 
 }
+
+async function getLMStudioModels(): Promise<ModelInfo[]> {
+  try {
+    const base_url = import.meta.env.LMSTUDIO_API_BASE_URL || "http://localhost:1234";
+    const response = await fetch(`${base_url}/v1/models`);
+    const data = await response.json() as any;
+    return data.data.map((model: any) => ({
+      name: model.id,
+      label: model.id,
+      provider: 'LMStudio',
+    }));
+  } catch (e) {
+    return [];
+  }
+}
+
+
 async function initializeModelList(): Promise<void> {
   const ollamaModels = await getOllamaModels();
   const openAiLikeModels = await getOpenAILikeModels();
-  MODEL_LIST = [...ollamaModels,...openAiLikeModels, ...staticModels];
+  const lmstudioModels = await getLMStudioModels();
+  MODEL_LIST = [...ollamaModels,...openAiLikeModels, ...staticModels,...lmstudioModels,];
 }
 initializeModelList().then();
-export { getOllamaModels, getOpenAILikeModels, initializeModelList };
+export { getOllamaModels,getOpenAILikeModels,getLMStudioModels,initializeModelList };

vite.config.ts

@@ -27,7 +27,7 @@ export default defineConfig((config) => {
       chrome129IssuePlugin(),
       config.mode === 'production' && optimizeCssModules({ apply: 'build' }),
     ],
-    envPrefix:["VITE_","OPENAI_LIKE_API_","OLLAMA_API_BASE_URL"],
+    envPrefix:["VITE_","OPENAI_LIKE_API_","OLLAMA_API_BASE_URL","LMSTUDIO_API_BASE_URL"],
     css: {
       preprocessorOptions: {
         scss: {

worker-configuration.d.ts

@@ -7,4 +7,5 @@ interface Env {
   OPENAI_LIKE_API_KEY: string;
   OPENAI_LIKE_API_BASE_URL: string;
   DEEPSEEK_API_KEY: string;
+  LMSTUDIO_API_BASE_URL: string;
 }