Une brève analyse de la façon d'appeler le module commonjs en mode nœud esmodule

Comment démarrer rapidement avec VUE3.0 : Début de l'apprentissage

J'ai récemment écrit beaucoup de scripts nodejs et j'ai rencontré un problème. Après avoir modifié le type : "module" de package.json, certains outils ne peuvent pas être utilisés normalement (ex : postcss-cli).

Cet article explique principalement comment résoudre le problème de l'utilisation du module commonjs en mode esmodule.

Solution

1. Remplacez le plug-in ;

cela semble absurde, mais ce n'est pas le cas. Prenons postcss comme exemple. En fait, il y a eu un problème à suivre, mais il n'a pas encore été mis à jour. J'ai vu des réimplémentations telles que postcss-es-modules (le volume de téléchargement n'est pas élevé, donc je ne l'ai pas encore essayé).

Ou utilisez des plug-ins via le support du framework vite/rollup lui-même (nous parlerons de la façon dont le framework lui-même le gère plus tard), par exemple

// tailwind.config.js
exporter par défaut {
  purge : ['./*.html', './src/**/*.{vue,js,ts,jsx,tsx,css}'],
  darkMode : false, // ou 'media' ou 'class'
  thème: {
    étendre: {},
  },
  variantes : {
    étendre: {},
  },
  plugins : [],
}
// postcss.config.js
importer le vent arrière depuis 'tailwindcss'
importer le préfixe automatique depuis 'autoprefixer'
importer tailwindConfig depuis './tailwind.config.js'

exporter par défaut {
  plugins : [tailwind(tailwindConfig), préfixe automatique],
}
// vite.config.js
css : {
  post-css,
}

2. Grâce à la méthode d'expansion prise en charge par nodejs (type : "module"), remplacez le suffixe du fichier par .cjs, puis vous pourrez importer le module commonjs via l'importation par défaut à partir de '*.cjs', par exemple

// utils.cjs

fonction somme(a, b) {
  retourner a + b
}
module.exports = {
  somme
}
// index.js
importer des utilitaires depuis './utils.js'

console.log(utils.sum(1, 2))

3. Marquez les fichiers d'entrée des différents modules via le champ d'exportation de package.json (c'est également une pratique courante pour la plupart des bibliothèques tierces, par exemple

// package

json
"exportations": {
  "import": "./index.js",
  "require": "./index.cjs"
}

Enregistrement de la question

1. Comment nodejs gère-t-il les fichiers de suffixe .mjs/.cjs ?

Nodejs charge toujours les fichiers .mjs avec le module esmodule et les fichiers .cjs avec commonjs. Lorsque package.json est défini sur type : "module", les fichiers .js sont toujours chargés en tant que esmodule.