Επεξεργασία κώδικα με Visual Studio Code για το Web (προεπισκόπηση)

[Αυτό το θέμα αποτελεί τεκμηρίωση προέκδοσης και υπόκειται σε αλλαγές.]

Από το στούντιο σχεδίασης, μπορείτε να επεξεργαστείτε τον κώδικα τοποθεσίας χρησιμοποιώντας το Visual Studio Code για το Web. Αυτή η δυνατότητα σάς επιτρέπει να επεξεργάζεστε στατικό περιεχόμενο, HTML, CSS, Liquid και JavaScript για τα παρακάτω μετα-δεδομένα τοποθεσίας Web:

Μετα-δεδομένα	Περιεχομένου
Σύνθετες φόρμες (φόρμες πολλαπλών βημάτων)	Javascript
Βασικές φόρμες	Javascript
Τμήματα περιεχομένου	Όλο το υποστηριζόμενο περιεχόμενο αποσπάσματος περιεχομένου
Λίστες	Javascript
Αρχεία Web	Προβολή και λήψη αρχείων πολυμέσων. Επεξεργασία αρχείων κειμένου (κώδικα).
Ιστοσελίδες	Όλο το υποστηριζόμενο περιεχόμενο (ανά γλώσσα), JavaScript και CSS
Πρότυπα Web	Όλο το υποστηριζόμενο περιεχόμενο

Σημείωμα

Δεν θα μπορείτε να δημιουργήσετε εγγραφές μετα-δεδομένων, να προσθέσετε και επεξεργαστείτε μόνο περιεχόμενο, κώδικα και συνημμένα αρχείων προβολής/λήψης.

Visual Studio Code για το Web παρέχει μια δωρεάν εμπειρία Visual Studio Code με μηδενική εγκατάσταση της Microsoft που εκτελείται εξ ολοκλήρου στο πρόγραμμα περιήγησής σας, επιτρέποντάς σας να περιηγηθείτε στον κώδικα τοποθεσίας και να κάνετε ελαφριές αλλαγές κώδικα γρήγορα και με ασφάλεια. Περισσότερες πληροφορίες: Visual Studio Code για το Web experience.

Σημαντικό

• Αυτή είναι μια δυνατότητα προεπισκόπησης.
• Οι λειτουργίες προεπισκόπησης δεν προορίζονται για παραγωγική χρήση και ενδέχεται να έχουν περιορισμένη λειτουργικότητα. Αυτές οι δυνατότητες είναι διαθέσιμες πριν από μια επίσημη κυκλοφορία έτσι ώστε οι πελάτες να έχουν πρόσβαση από νωρίς και να κάνουν σχόλια.

Σημείωμα

• Για πρώτη φορά Visual Studio Code για το Web φόρτος μπορεί να διαρκέσει αρκετή ώρα, καθώς θα εγκαταστήσει τις απαιτούμενες επεκτάσεις για αυτήν τη δυνατότητα.
• Οι λειτουργίες Δημιουργία, Διαγραφή και Μετονομασία αρχείων δεν υποστηρίζονται.
• Αυτή η δυνατότητα χρησιμοποιεί την επέκταση Web εργαλεία Power Platform . Οι επεκτάσεις Web περιορίζονται από το περιβάλλον προστατευμένης εκτέλεσης του προγράμματος περιήγησης και, επομένως, έχουν περιορισμούς σε σύγκριση με τις κανονικές επεκτάσεις.
  • Το CLI του Power Platform δεν υποστηρίζεται.
  • Οι δυνατότητες επέκτασης Web του Power Platform Tools περιορίζονται σε Power Pages εμπειρία επεξεργασίας κώδικα.
  • Αυτή η δυνατότητα δεν είναι διαθέσιμη στο Cloud κοινότητας δημόσιων οργανισμών (GCC), στο Cloud κοινότητας δημόσιων οργανισμών (GCC High) και στο Υπουργείο Άμυνας (DoD). Οι χρήστες σε αυτές τις περιοχές θα χρησιμοποιήσουν την εφαρμογή Διαχείριση πυλών για την επεξεργασία κώδικα. Ανατρέξτε στην Επεξεργασία κώδικα στην εφαρμογή διαχείρισης πυλών για περισσότερες πληροφορίες.

Επεξεργασία κώδικα που διατίθεται στο στούντιο σχεδίασης

Μπορείτε να ξεκινήσετε την επεξεργασία του κώδικα της τοποθεσίας σας χρησιμοποιώντας Visual Studio Code για το Web από την αρχική σελίδα Power Pages, επιλέγοντας Επεξεργασίες κώδικα τοποθεσίας από το αναπτυσσόμενο μενού Edit.

Μπορείτε επίσης να επεξεργαστείτε κώδικα στο στούντιο σχεδίασης από τις παρακάτω περιοχές:

• Επεξεργασία κώδικα ιστοσελίδας από χώρο εργασίας σελίδων
• Κωδικός προτύπου κεφαλίδας από το χώρο εργασίας σελίδων
• Επεξεργασία προσαρμοσμένου CSS κώδικα από το χώρο εργασίας styling
• Επεξεργασία προσαρμοσμένου κώδικα JavaScript για φόρμες πολλών στοιχείων
• Επεξεργασία προσαρμοσμένου κώδικα JavaScript για βασικές φόρμες
• Επεξεργασία προσαρμοσμένης JavaScript για λίστες
• Επεξεργασία τμημάτων περιεχομένου
• Επεξεργασία προτύπων web
• Προβολή και λήψη αρχείων web πολυμέσων (εικόνες)
• Επεξεργασία αρχείων web που βασίζονται σε κείμενο (CSS, JavaScript, άλλα)

Δείτε τον τρόπο επεξεργασίας κώδικα χρησιμοποιώντας αυτές τις περιοχές.

Επεξεργασία κώδικα ιστοσελίδας από χώρο εργασίας σελίδων

Όταν ανοίγετε Power Pages στούντιο σχεδίασης, βλέπετε την επιλογή Επεξεργασία κώδικα στο μενού Σελίδες¹ και στην επάνω δεξιά γωνία της οθόνης².

Επεξεργασία κώδικα ιστοσελίδας από χώρο εργασίας σελίδων.

Κωδικός προτύπου κεφαλίδας από το χώρο εργασίας σελίδων

Επιλέξτε Επεξεργασία κεφαλίδας τοποθεσίας και, στη συνέχεια, επιλέξτε Επεξεργασία κώδικα για να ανοίξετε το πρόγραμμα επεξεργασίας κώδικα.

Επεξεργασία κώδικα ιστοσελίδας από την κεφαλίδα Σελίδες.

Επεξεργασία προσαρμοσμένου CSS κώδικα από το χώρο εργασίας styling

Μεταβείτε στον χώρο εργασίας στυλ και επιλέξτε το διαθέσιμο προσαρμοσμένο μενού CSS Επεξεργασία κώδικα για να ανοίξετε το πρόγραμμα επεξεργασίας κώδικα.

Επεξεργασία κώδικα από το προσαρμοσμένο CSS.

Προβολή Power Pages ενεργειών

Η προβολή Power Pages Actions η οποία είναι προσβάσιμη στο κάτω μέρος της Εξερεύνησης αρχείων, σάς επιτρέπει να διαχειρίζεστε τοποθεσίες Power Pages απευθείας μέσα από το πρόγραμμα επεξεργασίας. Μειώνει την ανάγκη μετάβασης σε Power Pages στούντιο σχεδίασης, επιτρέποντας στους προγραμματιστές να εκτελούν συνήθεις εργασίες γρήγορα μέσα από το πρόγραμμα επεξεργασίας.

Διαθέσιμες ενέργειες

• Τοποθεσία προεπισκόπησης
  Αυτή η ενέργεια διαγράφει το cache ρύθμισης παραμέτρων και ανοίγει την τοποθεσία σε κώδικα VS. Επιτρέπει στους προγραμματιστές να κάνουν προεπισκόπηση και δοκιμή των αλλαγών στον κώδικα τοποθεσίας χωρίς να χρειάζεται να αλλάξουν περιβάλλον σε Power Pages στούντιο σχεδίασης.

• Άνοιγμα στο Power Pages design studio
  Μετά την πραγματοποίηση αλλαγών κώδικα, χρησιμοποιήστε αυτήν την ενέργεια για να μεταβείτε στο Power Pages design studio. Αυτό είναι χρήσιμο για τη ρύθμιση παραμέτρων υπηρεσιών παροχής ελέγχου ταυτότητας, ρόλων Web και άλλων ρυθμίσεων τοποθεσίας που δεν είναι επεξεργάσιμες στο πρόγραμμα επεξεργασίας κώδικα.

• Άνοιγμα στο VS Code Desktop
  Εάν είναι εγκατεστημένο το VS Code Desktop, αυτή η ενέργεια ανοίγει την τοποθεσία στην εφαρμογή υπολογιστή. Ενεργοποιεί επίσης μια λήψη τοποθεσίας, εξασφαλίζοντας ότι ο κώδικας είναι διαθέσιμος τοπικά και έτοιμος για επεξεργασία.

Ειδοποίηση διένεξης συγχώνευσης

Εάν συνεργάζεστε με άλλους προγραμματιστές, ενδέχεται να υπάρχουν περιπτώσεις όπου θα εργάζεστε στον ίδιο πηγαίο κώδικα. Σε περίπτωση που επιχειρήσετε να αποθηκεύσετε αλλαγές σε ένα ξεπερασμένο αρχείο, θα λάβετε μια ειδοποίηση για σύγκριση ή αντικατάσταση αλλαγών.

Η σύγκριση του κώδικα θα εμφανίσει τον τρέχοντα κώδικα μαζί με τον δικό σας κώδικα και θα σας επιτρέψει να επαναφέρετε τις υπάρχουσες αλλαγές, να αποδεχτείτε κάθε αλλαγή ξεχωριστά ή να χρησιμοποιήσετε τις αλλαγές σας και να αντικαταστήσετε τα υπάρχοντα περιεχόμενα.

Διενέξεις συγχώνευσης στον κώδικα.

Θα μπορείτε να αναθεωρήσετε το πιο πρόσφατο περιεχόμενο και είτε να συγχωνεύσετε είτε να αντικαταστήσετε τον κώδικα ή να απορρίψετε τις αλλαγές.

Εκμάθηση: Επεξεργασία κώδικα τοποθεσίας με χρήση Visual Studio Code για το Web

Σε αυτή την εκμάθηση, θα δείτε την επεξεργασία του κώδικα τοποθεσίας χρησιμοποιώντας Visual Studio Code για το Web.

Βήμα 1: Επεξεργασία κώδικα τοποθεσίας με χρήση Visual Studio Code για το Web

1. Ανοίξτε την τοποθεσία σας στο Power Pages design studio

2. Στην επάνω δεξιά γωνία, επιλέξτε Επεξεργασία κώδικα

   

3. Επιλέξτε Άνοιγμα Visual Studio Code από το παράθυρο διαλόγου επιβεβαίωσης.

4. Συνδεθείτε στο Visual Studio Code χρησιμοποιώντας τα διαπιστευτήρια του περιβάλλοντός σας.

5. Περιμένετε να εκκινηθεί η επέκταση web Power Platform Tools και να φορτωθεί ο κώδικας ιστοσελίδας στο αριστερό τμήμα παραθύρου.

Βήμα 2: Ενημέρωση περιεχομένου και κώδικα

1. Ο Εξερευνητής στην αριστερή πλευρά της οθόνης φορτώνει τα αντίστοιχα μετα-δεδομένα διαμόρφωσης της τοποθεσίας web, τα οποία μπορούν να επεξεργαστούν με τη χρήση του Visual Code for the Web.

   Μενού εξερεύνησης για χώρο εργασίας χωρίς τίτλο που εμφανίζει αρχεία web.

2. Κάντε αλλαγές στα αντίστοιχα αρχεία μετα-δεδομένων και πατήστε Ctrl+S για να αποθηκεύσετε τις αλλαγές.

3. Μεταβείτε στο στούντιο σχεδίασης και επιλέξτε Συγχρονισμός για να κάνετε όλες τις ενημερώσεις στην τρέχουσα περίοδο λειτουργίας του στούντιο σχεδίασης.

   

4. Επιλέξτε Προεπισκόπηση για να δείτε τις αλλαγές στην τοποθεσία Power Pages.

Χρήση Visual Studio Code για το Web ή το Visual Studio Code Desktop

Οι χρήστες μπορούν να επεξεργάζονται, να διορθώνουν και να προεπισκοπούν αλλαγές στις αλλαγές σελίδων χρησιμοποιώντας Visual Studio Code για το Web, χωρίς να χρειάζεται να χρησιμοποιήσουν εξωτερικά εργαλεία. το Visual Studio Code Desktop παρέχει άλλες προηγμένες δυνατότητες για την επεξεργασία όλων των μετα-δεδομένων τοποθεσίας και την ενοποίηση με GitHub, πλαίσια και διεργασίες συνεχούς ενοποίησης/συνεχούς ανάπτυξης (CI/CD).

Χαρακτηριστικό	VS Code για το Web	VS Code Desktop
Δημιουργία νέων εγγραφών μεταδεδομένων διαμόρφωσης ιστοσελίδας	όχι	Περιορισμός σε ιστοσελίδες, πρότυπα σελίδων, πρότυπα web, αρχεία περιεχομένου και αρχεία web.
Άμεση επεξεργασία τοποθεσίας	Όχι	όχι
Επεξεργασία μετα-δεδομένων τοποθεσίας	Περιορισμός στην επεξεργασία ιστοσελίδων, φορμών περιεχομένου, βασικών φορμών, φορμών πολλών βημάτων, λιστών και προτύπων web.	Όλες οι ρυθμίσεις παραμέτρων μετα-δεδομένων των Power Pages
Προεπισκόπηση τοποθεσίας	Προγραμματισμένη	Προγραμματισμένη
Υποστήριξη Power Platform CLI	όχι	Όχι
Σύνθετη ροή εργασιών CPU και αποθήκευσης - ReactJS ή άλλη υποστήριξη εργαλείου δόμησης πλαισίου	όχι	Όχι
GitHub ενοποίηση με δυνατότητες όπως μεταβίβαση κώδικα, ανάληψη ελέγχου, διαχείριση διενέξεων και συγχώνευση.	όχι	Όχι

Επεξεργασία κώδικα στην εφαρμογή διαχείρισης πύλης

Σημείωμα

• Η χρήση του Visual Studio Code web για την επεξεργασία τοποθεσιών web δεν υποστηρίζεται στο Cloud κοινότητας δημόσιων οργανισμών (GCC), στο Government Community Cloud (GCC High) και στο Υπουργείο Άμυνας (DoD). Οι χρήστες σε αυτές τις περιοχές μπορούν να χρησιμοποιήσουν την εφαρμογή διαχείρισης πύλης για να κάνουν τις αλλαγές τους.

Εάν η περιοχή δεν υποστηρίζει το Visual Studio Code για το Web, επιλέγοντας το εικονίδιο προγράμματος επεξεργασίας κώδικα </> στη γραμμή εντολών θα ανοίξει η εφαρμογή Portal Management.

Μεταβείτε στις αντίστοιχες καρτέλες ιστοσελίδων, βασικών φορμών, φορμων πολλών στοιχείων, λιστών ή προτύπων Web για επεξεργασία κώδικα.

Τύπος	Θέση κώδικα
Ιστοσελίδα	Επιλέξτε εγγραφή ιστοσελίδας. Επιλογή καρτέλας περιεχομένου ιστοσελίδας από την ενότητα Μεταφρασμένο περιεχόμενο. Μπορείτε να επεξεργαστείτε το αντίγραφο σελίδας στο πεδίο Αντιγραφή (HTML) της καρτέλας Γενικά. Μπορείτε να επεξεργαστείτε στον κώδικα Προσαρμοσμένο JavaScript και Προσαρμοσμένο CSS από την καρτέλα Για προχωρημένους.
Βασική φόρμα	Επιλέξτε τη βασική εγγραφή φόρμας. Επεξεργαστείτε προσαρμοσμένη JavaScript στην καρτέλα Πρόσθετες ρυθμίσεις .
Φόρμα πολλών βημάτων	Επιλέξτε την εγγραφή φόρμας πολλαπλών βημάτων.Επιλέξτε το βήμα φόρμας πολλών βημάτων από την καρτέλα Βήματα φόρμας . Επεξεργαστείτε προσαρμοσμένη JavaScript στην καρτέλα Επιλογές φόρμας .
Λίστα	Επιλέξτε την εγγραφή λίστας. Επεξεργαστείτε προσαρμοσμένη JavaScript στην καρτέλα Επιλογές .
Πρότυπο web	Επιλέξτε την εγγραφή προτύπου Web. Επεξεργαστείτε την προέλευση στην καρτέλα Γενικά .

Αποθηκεύστε την καρτέλα και κάντε προεπισκόπηση της τοποθεσίας Web για να δοκιμάσετε τον κώδικά σας.

Δείτε επίσης

• Χρήσιμη χρήση Visual Studio Code και Microsoft Power Platform CLI