JavaScript ਪ੍ਰੋਜੈਕਟਾਂ ਵਿੱਚ Vite ਦੇ ਕਲਾਸ ਫੀਲਡ ਪਰਿਵਰਤਨ ਤੋਂ ਬਚਣਾ

ਸਹਿਜ ਏਕੀਕਰਣ ਲਈ Vite ਵਿੱਚ ਕਲਾਸ ਫੀਲਡ ਪਰਿਵਰਤਨ ਦਾ ਪ੍ਰਬੰਧਨ ਕਰਨਾ

Vite ਆਧੁਨਿਕ JavaScript ਵਿਕਾਸ ਲਈ ਇੱਕ ਸ਼ਕਤੀਸ਼ਾਲੀ ਸੰਦ ਹੈ, ਵੈੱਬ ਐਪਲੀਕੇਸ਼ਨਾਂ ਨੂੰ ਬਣਾਉਣ ਲਈ ਇੱਕ ਤੇਜ਼ ਅਤੇ ਲਚਕਦਾਰ ਤਰੀਕੇ ਦੀ ਪੇਸ਼ਕਸ਼ ਕਰਦਾ ਹੈ। ਹਾਲਾਂਕਿ, ਡਿਵੈਲਪਰਾਂ ਨੂੰ ਕਈ ਵਾਰ ਚੁਣੌਤੀਆਂ ਦਾ ਸਾਹਮਣਾ ਕਰਨਾ ਪੈ ਸਕਦਾ ਹੈ ਜਦੋਂ ਵਾਈਟ ਕੋਡ ਨੂੰ ਉਹਨਾਂ ਤਰੀਕਿਆਂ ਨਾਲ ਬਦਲਦਾ ਹੈ ਜੋ ਦੂਜੇ ਸਿਸਟਮਾਂ ਨਾਲ ਟਕਰਾ ਜਾਂਦੇ ਹਨ। ਅਜਿਹਾ ਇੱਕ ਮੁੱਦਾ ਉਦੋਂ ਪੈਦਾ ਹੁੰਦਾ ਹੈ ਜਦੋਂ ਬਿਲਡ ਪ੍ਰਕਿਰਿਆ ਦੌਰਾਨ ਕਲਾਸ ਫੀਲਡਾਂ ਨੂੰ ਬਦਲਿਆ ਜਾਂਦਾ ਹੈ।

ਇਹ ਪਰਿਵਰਤਨ ਖਾਸ ਤੌਰ 'ਤੇ ਮੁਸ਼ਕਲ ਹੋ ਸਕਦਾ ਹੈ ਜਦੋਂ ਆਉਟਪੁੱਟ ਨੂੰ ਮੌਜੂਦਾ ਪਲੇਟਫਾਰਮਾਂ, ਜਿਵੇਂ ਕਿ ਫਾਊਂਡਰੀਵੀਟੀਟੀ ਸਿਸਟਮ ਨਾਲ ਸੁਚਾਰੂ ਢੰਗ ਨਾਲ ਏਕੀਕ੍ਰਿਤ ਕਰਨ ਦੀ ਲੋੜ ਹੁੰਦੀ ਹੈ। ਕੁਝ ਮਾਮਲਿਆਂ ਵਿੱਚ, ਇਹ ਪਰਿਵਰਤਨ ਟਕਰਾਵਾਂ ਦਾ ਕਾਰਨ ਬਣਦੇ ਹਨ ਜੋ ਕਲਾਸ ਫੀਲਡ ਦੀ ਸ਼ੁਰੂਆਤ ਵਿੱਚ ਵਿਘਨ ਪਾਉਂਦੇ ਹਨ, ਜਿਸ ਨਾਲ ਅਚਾਨਕ ਵਿਵਹਾਰ ਹੁੰਦਾ ਹੈ।

ਵੈਬ ਐਪਲੀਕੇਸ਼ਨਾਂ 'ਤੇ ਕੰਮ ਕਰਨ ਵਾਲੇ ਡਿਵੈਲਪਰਾਂ ਲਈ ਜੋ JavaScript ਐਕਸਟੈਂਸ਼ਨਾਂ ਜਾਂ ਪਲੱਗਇਨਾਂ ਦੀ ਵਰਤੋਂ ਕਰਦੇ ਹਨ, ਇਹ ਸਮਝਣਾ ਅਤੇ ਨਿਯੰਤਰਿਤ ਕਰਨਾ ਕਿ ਵਾਈਟ ਕਲਾਸ ਫੀਲਡਾਂ ਨੂੰ ਕਿਵੇਂ ਪ੍ਰਕਿਰਿਆ ਕਰਦਾ ਹੈ ਜ਼ਰੂਰੀ ਹੈ। ਕਲਾਸ ਫੀਲਡਾਂ ਨੂੰ ਕਸਟਮ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਵਿੱਚ ਬਦਲਣ ਦਾ ਡਿਫੌਲਟ ਵਿਵਹਾਰ ਗਲਤੀਆਂ ਦਾ ਕਾਰਨ ਬਣ ਸਕਦਾ ਹੈ, ਖਾਸ ਤੌਰ 'ਤੇ ਜੇ ਪਲੇਟਫਾਰਮ ਜਿਸ ਲਈ ਤੁਸੀਂ ਬਣਾ ਰਹੇ ਹੋ ਉਸ ਵਿੱਚ ਸਖਤ ਅੰਦਰੂਨੀ ਵਿਧੀ ਹੈ।

ਇਸ ਲੇਖ ਵਿੱਚ, ਅਸੀਂ ਪੜਚੋਲ ਕਰਾਂਗੇ ਕਿ ਵਾਈਟ ਦੇ ਕਲਾਸ ਫੀਲਡ ਪਰਿਵਰਤਨ ਨੂੰ ਕਿਵੇਂ ਪ੍ਰਬੰਧਿਤ ਕਰਨਾ ਹੈ, ਇਹਨਾਂ ਤਬਦੀਲੀਆਂ ਤੋਂ ਬਚਣ ਦੇ ਪਿੱਛੇ ਪ੍ਰੇਰਣਾਵਾਂ ਬਾਰੇ ਚਰਚਾ ਕਰੋ, ਅਤੇ ਕੁਝ ਸੰਰਚਨਾ ਵਿਕਲਪਾਂ ਦੀ ਸਮੀਖਿਆ ਕਰਾਂਗੇ ਜੋ ਸਮੱਸਿਆ ਨੂੰ ਹੱਲ ਕਰਨ ਵਿੱਚ ਤੁਹਾਡੀ ਮਦਦ ਕਰ ਸਕਦੀਆਂ ਹਨ। ਇਹਨਾਂ ਵਿਵਾਦਾਂ ਨੂੰ ਸੰਬੋਧਿਤ ਕਰਕੇ, ਤੁਸੀਂ FoundryVTT ਵਰਗੇ ਬਾਹਰੀ ਵੈਬ ਐਪਸ ਨਾਲ ਬਿਹਤਰ ਅਨੁਕੂਲਤਾ ਨੂੰ ਯਕੀਨੀ ਬਣਾ ਸਕਦੇ ਹੋ।

JavaScript ਪ੍ਰੋਜੈਕਟਾਂ ਵਿੱਚ ਵਾਈਟ ਕਲਾਸ ਫੀਲਡ ਪਰਿਵਰਤਨ ਨੂੰ ਸੰਭਾਲਣਾ

ਪ੍ਰਦਾਨ ਕੀਤੀਆਂ ਸਕ੍ਰਿਪਟਾਂ ਵਿੱਚ, ਫੋਕਸ Vite ਦੀ ਬਿਲਡ ਪ੍ਰਕਿਰਿਆ ਨੂੰ ਐਡਜਸਟ ਕਰਨ 'ਤੇ ਹੈ ਤਾਂ ਜੋ ਇਸਨੂੰ JavaScript ਕਲਾਸ ਫੀਲਡਾਂ ਨੂੰ ਅਜਿਹੇ ਤਰੀਕਿਆਂ ਨਾਲ ਬਦਲਣ ਤੋਂ ਰੋਕਿਆ ਜਾ ਸਕੇ ਜੋ ਫਾਊਂਡਰੀਵੀਟੀਟੀ ਵਰਗੇ ਬਾਹਰੀ ਸਿਸਟਮਾਂ ਨਾਲ ਟਕਰਾਅ ਦਾ ਕਾਰਨ ਬਣ ਸਕਦੇ ਹਨ। ਹੱਲ ਦੇ ਮੁੱਖ ਹਿੱਸਿਆਂ ਵਿੱਚੋਂ ਇੱਕ ਹੈ UseDefineForClassFields ਵਿੱਚ ਸੈਟਿੰਗ jsconfig.json ਫਾਈਲ। ਇਹ ਕਮਾਂਡ ਨਿਯੰਤਰਿਤ ਕਰਦੀ ਹੈ ਕਿ JavaScript ਕਲਾਸ ਫੀਲਡਾਂ ਨੂੰ ਕਿਵੇਂ ਕੰਪਾਇਲ ਕੀਤਾ ਜਾਂਦਾ ਹੈ, ਅਤੇ ਇਸਨੂੰ ਗਲਤ 'ਤੇ ਸੈੱਟ ਕਰਕੇ, ਅਸੀਂ Object.defineProperty ਦੀ ਵਰਤੋਂ ਕਰਨ ਤੋਂ ਬਚਦੇ ਹਾਂ, ਜੋ ਕਿ ਫਾਊਂਡਰੀਵੀਟੀਟੀ ਕਲਾਸ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਨੂੰ ਸ਼ੁਰੂਆਤੀ ਹੋਣ ਦੀ ਉਮੀਦ ਕਰਦਾ ਹੈ ਇਸ ਵਿੱਚ ਦਖਲ ਦੇ ਸਕਦਾ ਹੈ। ਇਹ ਵਿਧੀ ਸੰਕਲਨ ਪ੍ਰਕਿਰਿਆ 'ਤੇ ਵਧੇਰੇ ਨਿਯੰਤਰਣ ਪ੍ਰਦਾਨ ਕਰਦੀ ਹੈ।

ਹੱਲ ਦੇ ਇੱਕ ਹੋਰ ਮਹੱਤਵਪੂਰਨ ਹਿੱਸੇ ਵਿੱਚ ਬਿਲਡ ਸੈਟਿੰਗਾਂ ਨੂੰ ਅਨੁਕੂਲਿਤ ਕਰਨਾ ਸ਼ਾਮਲ ਹੈ vite.config.js ਫਾਈਲ। ਸੰਰਚਨਾ ਵਿੱਚ ਕਮਾਂਡਾਂ ਸ਼ਾਮਲ ਹਨ preserveModules ਅਤੇ entryFileNames. ਦ preserveModules ਕਮਾਂਡ ਇਹ ਸੁਨਿਸ਼ਚਿਤ ਕਰਦੀ ਹੈ ਕਿ ਵਾਈਟ ਬਿਲਡ ਦੇ ਦੌਰਾਨ ਮੋਡੀਊਲ ਢਾਂਚੇ ਨੂੰ ਸਮਤਲ ਨਹੀਂ ਕਰਦਾ ਹੈ, ਜੋ ਉਹਨਾਂ ਐਪਲੀਕੇਸ਼ਨਾਂ ਲਈ ਮਹੱਤਵਪੂਰਨ ਹੈ ਜੋ ਪਲੱਗਇਨ ਜਾਂ ਲਾਇਬ੍ਰੇਰੀਆਂ ਵਰਗੀਆਂ ਮੋਡੀਊਲ ਸੀਮਾਵਾਂ 'ਤੇ ਨਿਰਭਰ ਕਰਦੇ ਹਨ। ਦ entryFileNames ਵਿਕਲਪ ਦੀ ਵਰਤੋਂ ਫਿਰ ਤਿਆਰ ਕੀਤੀਆਂ ਫਾਈਲਾਂ ਦੇ ਨਾਮਕਰਨ ਪਰੰਪਰਾ ਨੂੰ ਨਿਯੰਤਰਿਤ ਕਰਨ ਲਈ ਕੀਤੀ ਜਾਂਦੀ ਹੈ, ਇਹ ਯਕੀਨੀ ਬਣਾਉਣ ਲਈ ਕਿ ਉਹ ਸੰਭਾਵੀ ਟਕਰਾਅ ਤੋਂ ਬਚਦੇ ਹੋਏ, ਬਾਹਰੀ ਸਿਸਟਮ ਦੇ ਅਨੁਕੂਲ ਤਰੀਕੇ ਨਾਲ ਬਣਤਰ ਹਨ।

ਇਸ ਤੋਂ ਇਲਾਵਾ, ਹੱਲ ਏਕੀਕ੍ਰਿਤ ਕਰਦਾ ਹੈ @babel/plugin-syntax-class-properties ਪਲੱਗਇਨ ਜੇਕਰ ਡਿਵੈਲਪਰਾਂ ਨੂੰ ਕਲਾਸ ਫੀਲਡਾਂ 'ਤੇ ਕਾਰਵਾਈ ਕਰਨ ਦੇ ਤਰੀਕੇ 'ਤੇ ਹੋਰ ਨਿਯੰਤਰਣ ਦੀ ਲੋੜ ਹੁੰਦੀ ਹੈ। ਇਹ ਬੈਬਲ ਪਲੱਗਇਨ ਆਧੁਨਿਕ JavaScript ਵਿੱਚ ਉਹਨਾਂ ਦੀ ਵਰਤੋਂ ਦੀ ਆਗਿਆ ਦਿੰਦੇ ਹੋਏ ਕਲਾਸ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਦੇ ਪਰਿਵਰਤਨ ਨੂੰ ਰੋਕਦੀ ਹੈ। ਇਹ ਪਹੁੰਚ ਉਹਨਾਂ ਸਥਿਤੀਆਂ ਲਈ ਬਹੁਤ ਪ੍ਰਭਾਵਸ਼ਾਲੀ ਹੈ ਜਿੱਥੇ ਪੁਰਾਤਨ ਪਲੇਟਫਾਰਮਾਂ ਦੇ ਨਾਲ ਅਨੁਕੂਲਤਾ ਜ਼ਰੂਰੀ ਹੈ, ਕਿਉਂਕਿ ਇਹ ਯਕੀਨੀ ਬਣਾਉਂਦਾ ਹੈ ਕਿ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਉਹਨਾਂ ਦੇ ਮੂਲ ਸੰਟੈਕਸ ਨੂੰ ਬਰਕਰਾਰ ਰੱਖਦੀਆਂ ਹਨ, ਖਪਤ ਕਰਨ ਵਾਲੇ ਸਿਸਟਮ ਦੇ ਅੰਦਰੂਨੀ ਨਾਲ ਟਕਰਾਅ ਨੂੰ ਰੋਕਦੀਆਂ ਹਨ।

ਅੰਤ ਵਿੱਚ, ਦੀ ਵਰਤੋਂ ਰੋਲਅੱਪ-ਪਲੱਗਇਨ-ਕਾਪੀ ਹੱਲ ਦਾ ਇੱਕ ਹੋਰ ਕੀਮਤੀ ਹਿੱਸਾ ਹੈ। ਇਹ ਪਲੱਗਇਨ ਇਹ ਯਕੀਨੀ ਬਣਾਉਂਦਾ ਹੈ ਕਿ ਬਿਲਡ ਪ੍ਰਕਿਰਿਆ ਦੇ ਦੌਰਾਨ ਜ਼ਰੂਰੀ ਸਥਿਰ ਸੰਪਤੀਆਂ ਜਾਂ ਸੰਰਚਨਾ ਫਾਈਲਾਂ ਦੀ ਨਕਲ ਕੀਤੀ ਗਈ ਹੈ, ਜੋ ਕਿ ਗੁੰਝਲਦਾਰ ਵਾਤਾਵਰਨ ਵਿੱਚ ਤੈਨਾਤੀ ਲਈ ਜ਼ਰੂਰੀ ਹੈ। ਇਹ ਖਾਸ ਫਾਈਲਾਂ ਨੂੰ ਲੋੜ ਅਨੁਸਾਰ ਤਬਦੀਲ ਕਰਨ ਜਾਂ ਨਾਮ ਬਦਲਣ ਦੀ ਆਗਿਆ ਦੇ ਕੇ ਬਿਲਡ ਸਿਸਟਮ ਵਿੱਚ ਲਚਕਤਾ ਜੋੜਦਾ ਹੈ। ਜਦੋਂ ਜੋੜਿਆ ਜਾਂਦਾ ਹੈ, ਤਾਂ ਇਹ ਕਮਾਂਡਾਂ ਅਤੇ ਪਲੱਗਇਨ ਇਹ ਯਕੀਨੀ ਬਣਾਉਂਦੇ ਹਨ ਕਿ ਆਉਟਪੁੱਟ ਫਾਊਂਡਰੀਵੀਟੀਟੀ ਵਰਗੇ ਸਿਸਟਮਾਂ ਦੇ ਅਨੁਕੂਲ ਰਹੇ ਜਦੋਂ ਕਿ Vite ਦੀ ਤੇਜ਼ ਬਿਲਡ ਪ੍ਰਕਿਰਿਆ ਦੀ ਵਰਤੋਂ ਕਰਨ ਦੇ ਲਾਭਾਂ ਨੂੰ ਬਰਕਰਾਰ ਰੱਖਦੇ ਹੋਏ।

import { defineConfig } from 'vite';
import copy from 'rollup-plugin-copy';
import { svelte } from '@sveltejs/vite-plugin-svelte';
import path from 'path';

export default defineConfig({
  resolve: {
    alias: {
      // Define your custom aliases here
    },
  },
  build: {
    outDir: 'dist',
    emptyOutDir: true,
    minify: false,
    lib: {
      name: 'animabf',
      entry: 'src/animabf.mjs',
      formats: ['es'],
    },
    rollupOptions: {
      output: {
        preserveModules: true,
        preserveModulesRoot: 'src',
        entryFileNames: ({ name: fileName }) => {
          return `${fileName}.js`;
        },
        assetFileNames: 'animabf.[ext]'
      }
    }
  },
  plugins: [
    svelte(),
    copy({ /* Specify your file copying rules */ })
  ]
});

// Install Babel and necessary presets/plugins
// npm install --save-dev @babel/core @babel/preset-env

module.exports = {
  presets: [
    ['@babel/preset-env', {
      targets: { esmodules: true }, // Adjust for desired compatibility
      useBuiltIns: 'usage',
      corejs: 3
    }]
  ],
  plugins: [
    '@babel/plugin-syntax-class-properties'
  ]
};

{
  "compilerOptions": {
    "target": "ESNext",
    "useDefineForClassFields": false,
    "lib": ["dom", "dom.iterable", "esnext"],
    "moduleResolution": "node",
    "esModuleInterop": true,
    "allowJs": true,
    "checkJs": true,
    "strict": true,
    "strictNullChecks": true,
  }
}

Vite ਵਿੱਚ ਕਲਾਸ ਫੀਲਡ ਪਰਿਵਰਤਨ ਨੂੰ ਸੰਬੋਧਨ ਕਰਨਾ: ਇਨਸਾਈਟਸ ਅਤੇ ਵਿਕਲਪ

Vite ਅਤੇ ਕਲਾਸ ਫੀਲਡ ਪਰਿਵਰਤਨ ਦੇ ਨਾਲ ਕੰਮ ਕਰਦੇ ਸਮੇਂ ਖੋਜਣ ਲਈ ਇੱਕ ਮਹੱਤਵਪੂਰਨ ਪਹਿਲੂ ਇਹ ਸਮਝਣਾ ਹੈ ਕਿ ਇਹ ਪਰਿਵਰਤਨ ਪਹਿਲੀ ਥਾਂ 'ਤੇ ਕਿਉਂ ਹੁੰਦੇ ਹਨ। Vite ਹੁੱਡ ਦੇ ਹੇਠਾਂ ਰੋਲਅੱਪ ਦੀ ਵਰਤੋਂ ਕਰਦਾ ਹੈ, ਅਤੇ ਰੋਲਅੱਪ, ਸੰਰਚਨਾ 'ਤੇ ਨਿਰਭਰ ਕਰਦਾ ਹੈ, ਬਿਹਤਰ ਬ੍ਰਾਊਜ਼ਰ ਅਨੁਕੂਲਤਾ ਨੂੰ ਯਕੀਨੀ ਬਣਾਉਣ ਲਈ ਕਲਾਸ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਨੂੰ ਅਨੁਕੂਲਿਤ ਕਰ ਸਕਦਾ ਹੈ। ਹਾਲਾਂਕਿ, ਫਾਊਂਡਰੀਵੀਟੀਟੀ ਐਕਸਟੈਂਸ਼ਨਾਂ ਵਰਗੇ ਪ੍ਰੋਜੈਕਟਾਂ ਲਈ, ਇਹ ਅਨੁਕੂਲਤਾ ਸਮੱਸਿਆਵਾਂ ਪੈਦਾ ਕਰ ਸਕਦੀ ਹੈ ਕਿਉਂਕਿ ਫਾਊਂਡਰੀਵੀਟੀਟੀ ਕਲਾਸ ਫੀਲਡਾਂ ਨੂੰ ਸ਼ੁਰੂ ਕਰਨ ਅਤੇ ਪ੍ਰਬੰਧਨ ਦੇ ਇੱਕ ਖਾਸ ਤਰੀਕੇ 'ਤੇ ਨਿਰਭਰ ਕਰਦਾ ਹੈ। ਇਹਨਾਂ ਖੇਤਰਾਂ ਨੂੰ ਬਦਲ ਕੇ, Vite ਅਣਜਾਣੇ ਵਿੱਚ ਅਨੁਕੂਲਤਾ ਨੂੰ ਤੋੜਦਾ ਹੈ, ਜਿਸ ਨਾਲ ਵੈੱਬ ਐਪ ਵਿੱਚ ਪਲੱਗਇਨ ਜਾਂ ਐਕਸਟੈਂਸ਼ਨ ਦੀ ਵਰਤੋਂ ਕਰਨ ਵਿੱਚ ਸਮੱਸਿਆਵਾਂ ਆਉਂਦੀਆਂ ਹਨ।

ਇਹਨਾਂ ਮੁੱਦਿਆਂ ਨੂੰ ਘਟਾਉਣ ਲਈ, ਤੁਹਾਡੀ ਬਿਲਡ ਕੌਂਫਿਗਰੇਸ਼ਨ ਨੂੰ ਅਨੁਕੂਲ ਕਰਨਾ ਮਹੱਤਵਪੂਰਨ ਹੈ। ਸੈਟਿੰਗ UseDefineForClassFields ਤੁਹਾਡੇ ਵਿੱਚ jsconfig.json to false ਕੰਪਾਈਲਰ ਨੂੰ ਵਰਤਣ ਤੋਂ ਰੋਕ ਸਕਦਾ ਹੈ Object.defineProperty ਕਲਾਸ ਖੇਤਰਾਂ 'ਤੇ, ਇਸ ਤਰ੍ਹਾਂ ਮੂਲ ਸੰਟੈਕਸ ਨੂੰ ਬਰਕਰਾਰ ਰੱਖਦੇ ਹੋਏ। ਇਹ ਉਦੋਂ ਲਾਭਦਾਇਕ ਹੁੰਦਾ ਹੈ ਜਦੋਂ ਲਾਇਬ੍ਰੇਰੀਆਂ ਜਾਂ ਪਲੱਗਇਨਾਂ ਨੂੰ ਉਹਨਾਂ ਸਿਸਟਮਾਂ ਨਾਲ ਇੰਟਰੈਕਟ ਕਰਨ ਲਈ ਬਣਾਇਆ ਜਾਂਦਾ ਹੈ ਜੋ ਨੇਟਿਵ ਕਲਾਸ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਦੀ ਉਮੀਦ ਕਰਦੇ ਹਨ। ਇਸ ਤੋਂ ਇਲਾਵਾ, ਸੈਟਿੰਗਾਂ ਜਿਵੇਂ ਕਿ ਫਾਈਨ-ਟਿਊਨਿੰਗ ਰੋਲਅੱਪ preserveModules ਅਤੇ ਫਾਈਲ ਆਉਟਪੁੱਟ ਨੂੰ ਅਨੁਕੂਲਿਤ ਕਰਨਾ ਯਕੀਨੀ ਬਣਾਉਂਦਾ ਹੈ ਕਿ ਤੁਹਾਡੇ ਮੋਡਿਊਲ ਇਸ ਤਰੀਕੇ ਨਾਲ ਬਣਤਰ ਬਣੇ ਰਹਿਣ ਕਿ ਬਾਹਰੀ ਐਪਲੀਕੇਸ਼ਨਾਂ, ਜਿਵੇਂ ਕਿ ਫਾਊਂਡਰੀਵੀਟੀਟੀ, ਸਹੀ ਢੰਗ ਨਾਲ ਖਪਤ ਕਰ ਸਕਦੀਆਂ ਹਨ।

ਵਿਚਾਰਨ ਯੋਗ ਇਕ ਹੋਰ ਵਿਕਲਪ ਬੈਬਲ ਦੀ ਵਰਤੋਂ ਕਰਨਾ ਹੈ. ਆਪਣੀ Vite ਸੰਰਚਨਾ ਦੇ ਨਾਲ Babel ਨੂੰ ਜੋੜ ਕੇ, ਤੁਸੀਂ ਖਾਸ ਪਲੱਗਇਨਾਂ ਦਾ ਲਾਭ ਲੈ ਸਕਦੇ ਹੋ ਜਿਵੇਂ ਕਿ @babel/plugin-syntax-class-properties ਕਲਾਸ ਫੀਲਡ ਦੇ ਪਰਿਵਰਤਨ ਨੂੰ ਪੂਰੀ ਤਰ੍ਹਾਂ ਰੋਕਣ ਲਈ। ਇਹ ਪਹੁੰਚ ਵਿਸ਼ੇਸ਼ ਤੌਰ 'ਤੇ ਲਾਭਦਾਇਕ ਹੈ ਜਦੋਂ ES ਮੋਡੀਊਲ ਸਮਰਥਨ ਦੇ ਵੱਖੋ-ਵੱਖਰੇ ਪੱਧਰਾਂ ਦੇ ਨਾਲ ਕਈ ਵਾਤਾਵਰਣਾਂ ਨੂੰ ਨਿਸ਼ਾਨਾ ਬਣਾਇਆ ਜਾਂਦਾ ਹੈ, ਇਹ ਯਕੀਨੀ ਬਣਾਉਂਦਾ ਹੈ ਕਿ ਤੁਹਾਡਾ ਪਲੱਗਇਨ ਵੱਖ-ਵੱਖ ਪਲੇਟਫਾਰਮਾਂ ਵਿੱਚ ਲਗਾਤਾਰ ਵਿਵਹਾਰ ਕਰਦਾ ਹੈ।