Estrai ed esporta

Export in Vue

Esporta una sezione di qualsiasi sito come Single File Component Vue con stili scoped, solo dal CSS dell'autore: breakpoint, hover e variabili inclusi.

Aggiornata il 20 ottobre 2026

L’export Vue ti dà una sezione di qualsiasi sito come Single File Component Vue: template e stili in un solo file .vue, con il CSS in un blocco <style scoped> che vale solo per quel componente.

Come esportare una sezione in Vue

Apri l’inspector con Alt+I e fai clic sulla sezione o sul componente che ti serve.
Scegli Vue nella finestra di export.
Controlla l’anteprima isolata a 375, 768, 1024 e 1280 px, o in uno dei 27 dispositivi con cornice.
Copia il codice o scarica il file e aggiungilo al tuo progetto Vue.

Cosa c’è nel componente

Parte	Contenuto
Template	Il markup della sezione
Stili	Un blocco `<style scoped>` con le regole dell’autore per quella sezione

Gli stili arrivano dai fogli di stile originali del sito, non dai valori calcolati, quindi il componente tiene:

ogni regola @media, @supports e @container;
:hover, :focus, :focus-visible, :focus-within e :active, anche quando lo stato è su un antenato (per esempio .card:hover .titolo);
::before e ::after e il CSS nidificato;
le var() risolte con il valore del sito e gli URL assoluti.

Con gli stili scoped le regole esportate non finiscono nel resto dell’app, e i reset universali del sito originale restano comunque fuori. Per l’elenco completo di cosa viene tenuto e perché vedi Export in HTML + CSS.

Export in Vue

Come esportare una sezione in Vue

Cosa c’è nel componente

Free e Pro

Limiti

Correlati