อ่านต่อไปเพื่อดูข้อมูลเบื้องต้นที่คุณต้องทราบเพื่อเริ่มต้นใช้งาน Project IDX
ก่อนเริ่มต้น
ก่อนเริ่มต้นใช้งาน คุณอาจต้องเปิดใช้คุกกี้ของบุคคลที่สามสำหรับเบราว์เซอร์ โปรเจ็กต์ IDX ต้องใช้คุกกี้ของบุคคลที่สามในเบราว์เซอร์ส่วนใหญ่เพื่อตรวจสอบสิทธิ์พื้นที่ทำงาน
Chrome
- เปิดการตั้งค่า
- เปิดแท็บความเป็นส่วนตัวและความปลอดภัย
- ตรวจสอบว่าเปิดใช้อนุญาตคุกกี้ทั้งหมดแล้ว
- เปิด idx.google.com
- คลิกไอคอนระดับการเข้าถึงในแถบที่อยู่ visibility_off เพื่อเปิดแผงการป้องกันการติดตาม เปิดการตั้งค่าคุกกี้ของบุคคลที่สามเพื่ออนุญาตคุกกี้ของบุคคลที่สามชั่วคราว ซึ่งจะเปิดใช้คุกกี้บน IDX เป็นเวลา 90 วัน
Safari
- เปิด Safari > การตั้งค่า...
- ปิดการตั้งค่าต่อไปนี้
- ขั้นสูง > บล็อกคุกกี้ทั้งหมด
- ความเป็นส่วนตัว > ป้องกันการติดตามข้ามเว็บไซต์
- เปิด idx.google.com
Firefox
คุณไม่จำเป็นต้องเปิดใช้คุกกี้ของบุคคลที่สามใน Firefox ไปที่ idx.google.com
โอเปร่า
- เปิด idx.google.com
- เปิดเมนูและคลิกการตั้งค่า
- ไปที่ส่วนความเป็นส่วนตัวและความปลอดภัย และขยายตัวเลือกคุกกี้ของบุคคลที่สาม
- เลือกบล็อกคุกกี้ของบุคคลที่สามในโหมดไม่ระบุตัวตน หรืออนุญาตคุกกี้ของบุคคลที่สาม
- เปิด idx.google.com
Arc
- ไปที่ arc://settings
- ไปที่ส่วนความเป็นส่วนตัวและความปลอดภัย และขยายตัวเลือก คุกกี้ของบุคคลที่สาม
- เลือกบล็อกคุกกี้ของบุคคลที่สามในโหมดไม่ระบุตัวตน หรืออนุญาตคุกกี้ของบุคคลที่สาม
- เปิด idx.google.com
Brave
คุณไม่จำเป็นต้องเปิดใช้คุกกี้ของบุคคลที่สามสำหรับ Brave ไปที่ idx.google.com
สร้างพื้นที่ทำงาน
พื้นที่ทำงานใน IDX เป็นสภาพแวดล้อมการพัฒนาที่มีทุกอย่างที่จำเป็นสำหรับการพัฒนาแอปพลิเคชัน ซึ่งมีโค้ด ตัวแก้ไขโค้ด (พร้อมปลั๊กอินที่เกี่ยวข้องกับโปรเจ็กต์ของคุณ) และเชนเครื่องมือที่รองรับการพัฒนาแอป คล้ายกับการสร้างโปรเจ็กต์ใหม่ในสภาพแวดล้อมการพัฒนาเดสก์ท็อปในเครื่องของคุณ เพียงแต่ว่าคุณจะมีคอมพิวเตอร์และระบบปฏิบัติการที่กำหนดค่าไว้ล่วงหน้าและมีไว้เพื่อสร้างแอปพลิเคชันโดยเฉพาะ
พื้นที่ทำงาน IDX ของโปรเจ็กต์ได้รับการเพิ่มประสิทธิภาพให้มีฐานของโค้ดทีละรายการ ดังนั้นคุณจึงแยกสภาพแวดล้อมและการอ้างอิงระดับระบบของแอปพลิเคชันต่างๆ ออกจากกันได้
หากคุณกำลังสร้างแอปใหม่ ให้ใช้เทมเพลตพื้นที่ทำงานที่มีการจัดการใน IDX เพื่อเริ่มต้นใช้งานอย่างรวดเร็ว หรือคุณจะนำเข้าฐานโค้ดของแอปพลิเคชัน ที่มีอยู่ไปยัง IDX ก็ได้
หากต้องการสร้างพื้นที่ทำงานใหม่ ให้ทำตามขั้นตอนต่อไปนี้
เปิด Project IDX
เมื่อเปิด IDX เป็นครั้งแรก ระบบจะแจ้งให้คุณอ่านและยอมรับข้อกำหนดในการให้บริการสำหรับผลิตภัณฑ์ของ Google, Generative AI และ Android SDK คุณยังสามารถเลือกรับการสื่อสารเกี่ยวกับการอัปเดตผลิตภัณฑ์และประกาศ หรือการศึกษาผู้ใช้เพื่อปรับปรุงผลิตภัณฑ์ของเราได้ด้วย เลือกตัวเลือกที่เหมาะกับคุณ คลิกลิงก์ที่ให้มาเพื่ออ่านข้อกำหนดในการให้บริการ จากนั้นเลือกตัวเลือกเพื่อยอมรับข้อกำหนดและคลิกต่อไป ต่อจากนั้น คุณสามารถตัดสินใจเปิดใช้ฟีเจอร์ AI ตั้งแต่การใช้ IDX ครั้งแรก หรือปล่อยไว้เช่นนั้นโดยคลิกไว้ทีหลัง (คุณเปิดใช้ในภายหลังได้ทุกเมื่อ) หากคุณเปิดใช้ข้อมูลนี้ในหน้าจอนี้ ให้อ่านหมายเหตุเกี่ยวกับ AI และความเป็นส่วนตัว แล้วคลิกต่อไปเพื่อเก็บการตั้งค่าไว้ หรือย้อนกลับเพื่อปิดฟีเจอร์ AI
เลือกประเภทพื้นที่ทำงานที่คุณต้องการสร้าง ดังนี้
- เทมเพลต: สร้างพื้นที่ทำงานที่โหลดไว้ล่วงหน้าด้วยไฟล์และแพ็กเกจพื้นฐานที่คุณอาจต้องใช้ เลือกเทมเพลตแนะนำรายการหนึ่งหรือคลิกดูเทมเพลตทั้งหมดเพื่อดูรายการเฟรมเวิร์ก, API และภาษาทั้งหมดที่พร้อมใช้งาน นอกจากนี้ คุณยังค้นหาเทมเพลตพื้นที่ทำงานเปล่าได้ในไลบรารีเทมเพลต
- ที่เก็บ GitHub: เลือกนำเข้าที่เก็บเพื่อโคลนที่เก็บ GitHub ลงในพื้นที่ทำงาน
เทมเพลต
เรียกดูเทมเพลตตามประเภทแอปพลิเคชันหรือใช้ช่องค้นหาที่ด้านบนขวาเพื่อกรองคลังเทมเพลตแบบเต็มตามคีย์เวิร์ด เทมเพลตพื้นที่ทำงานว่างเปล่าจะมีให้ใช้ในหมวดหมู่เบ็ดเตล็ด
ป้อนชื่อพื้นที่ทำงานและตั้งค่าตัวเลือกเพิ่มเติม
คลิกสร้าง IDX จะสร้างพื้นที่ทำงานใหม่ตามการเลือกของคุณ
เราเพิ่มเทมเพลตใหม่ๆ อยู่เสมอ ดังนั้นโปรดกลับมาตรวจสอบหรือแจ้งให้เราทราบว่าคุณต้องการดูอะไร
การนำเข้า GitHub
ป้อน URL ที่เก็บ
คลิกสร้าง IDX จะสร้างพื้นที่ทำงานใหม่ตามการเลือกของคุณ
ตรวจสอบสิทธิ์ไปยัง GitHub หลังจากโหลดพื้นที่ทำงานแล้ว
เรียกใช้
npm install(หรือflutter pub get) ในเทอร์มินัล IDX หลังจากนำเข้าโปรเจ็กต์ โดยค่าเริ่มต้น IDX จะไม่ติดตั้งการขึ้นต่อกันของ npm เมื่อคุณนำเข้าโปรเจ็กต์
กำหนดค่าพื้นที่ทำงาน
IDX ใช้ Nix เพื่อกำหนดการกำหนดค่าสภาพแวดล้อมสำหรับพื้นที่ทำงานแต่ละแห่ง Nix เป็นผู้จัดการแพ็กเกจที่มีฟังก์ชันการทำงานเพียงอย่างเดียวและกำหนดตัวระบุที่ไม่ซ้ำกันให้กับทรัพยากร Dependency แต่ละรายการ ซึ่งหมายความว่าสภาพแวดล้อมของคุณจะมีทรัพยากร Dependency เดียวกันหลายเวอร์ชันได้อย่างราบรื่น นอกจากนี้ยังสามารถทำให้เกิดซ้ำและประกาศได้ด้วย ในบริบทของ IDX คุณจะแชร์ไฟล์การกำหนดค่า Nix ในพื้นที่ทำงานต่างๆ เพื่อโหลดการกำหนดค่าสภาพแวดล้อมเดียวกันได้ ดูข้อมูลเพิ่มเติมเกี่ยวกับ Nix + IDX
สร้างหรือแก้ไขไฟล์ .idx/dev.nix
การกำหนดค่าสภาพแวดล้อมจะกำหนดไว้ในไฟล์ .idx/dev.nix ในที่เก็บโค้ด ไฟล์นี้จะช่วยให้คุณระบุแพ็กเกจที่ติดตั้งไว้ ตัวแปรสภาพแวดล้อม และส่วนขยาย Code OSS
ดูตัวอย่างไฟล์ .idx/dev.nix ต่อไปนี้สำหรับการกำหนดค่าสภาพแวดล้อมพื้นที่ทำงานพื้นฐานที่เปิดใช้การแสดงตัวอย่างแอปใน IDX
{ pkgs, ... }: {
# Which nixpkgs channel to use.
channel = "stable-23.11"; # or "unstable"
# Use https://search.nixos.org/packages to find packages
packages = [
pkgs.nodejs_18
];
# Sets environment variables in the workspace
env = {
SOME_ENV_VAR = "hello";
};
# Search for the extensions you want on https://open-vsx.org/ and use "publisher.id"
idx.extensions = [
"angular.ng-template"
];
# Enable previews and customize configuration
idx.previews = {
enable = true;
previews = {
web = {
command = [
"npm"
"run"
"start"
"--"
"--port"
"$PORT"
"--host"
"0.0.0.0"
"--disable-host-check"
];
manager = "web";
};
};
};
}
ใช้การกำหนดค่าใหม่
เมื่อใดก็ตามที่คุณเพิ่มหรืออัปเดตไฟล์การกำหนดค่า dev.nix IDX จะแสดงข้อความแจ้งที่มุมขวาล่างเพื่อสร้างสภาพแวดล้อมอีกครั้ง
เวลาที่ใช้ในการสร้างสภาพแวดล้อมอีกครั้งจะขึ้นอยู่กับจำนวนแพ็กเกจที่การกำหนดค่าของคุณต้องการ
แก้ไขข้อบกพร่องของบิลด์สภาพแวดล้อม
เนื่องจากไฟล์การกำหนดค่าเป็นโค้ดที่เครื่องอ่านได้ จึงอาจมีข้อผิดพลาดได้
หากเกิดกรณีนี้ขึ้น สภาพแวดล้อมอาจไม่สามารถสร้างและไม่สามารถเริ่มต้นได้ IDX แสดงตัวเลือกในการเริ่มสภาพแวดล้อมการกู้คืน พื้นที่ทำงานนี้จะไม่รวมการกำหนดค่าใดๆ ที่คุณได้กำหนดไว้ และเพียงแค่เรียกใช้ Code OSS พื้นฐานเท่านั้น วิธีนี้จะช่วยให้คุณแก้ไขข้อผิดพลาดในไฟล์การกำหนดค่า dev.nix และสร้างสภาพแวดล้อมอีกครั้งได้
IDX จะแสดงข้อผิดพลาดในการสร้างสภาพแวดล้อมในที่สุด ตอนนี้คุณต้องแก้ปัญหาด้วยตัวเอง