Uma breve análise de como chamar o módulo commonjs no modo esmodule do nó

Como começar rapidamente com o VUE3.0: Iniciando o aprendizado,

tenho escrito muitos scripts nodejs recentemente e encontrei um problema. Após modificar o tipo: "module" do package.json, algumas ferramentas não podem ser usadas normalmente (por exemplo, postcss-cli).

Este artigo registra principalmente como resolver o problema de uso do módulo commonjs no modo esmodule.

Solução

1. Substituir o plug-in

parece bobagem, mas não é. Tomemos o postcss como exemplo. Na verdade, houve um problema para acompanhar, mas ainda não foi atualizado. Já vi reimplementações como postcss-es-modules (o volume de download não é alto, então ainda não experimentei).

Ou use plug-ins através do suporte da própria estrutura vite/rollup (falaremos sobre como a própria estrutura lida com isso mais tarde), por exemplo

// tailwind.config.js
padrão de exportação {
  purgar: ['./*.html', './src/**/*.{vue,js,ts,jsx,tsx,css}'],
  darkMode: false, // ou 'media' ou 'class'
  tema: {
    estender: {},
  },
  variantes: {
    estender: {},
  },
  plug-ins: [],
}
//postcss.config.js
importar tailwind de 'tailwindcss'
importar autoprefixer de 'autoprefixer'
importar tailwindConfig de './tailwind.config.js'

padrão de exportação {
  plug-ins: [tailwind(tailwindConfig), autoprefixer],
}
//vite.config.js
CSS: {
  pós-css,
}

module

"), altere o sufixo do arquivo para .cjs, e então você pode importar o módulo commonjs através de import default from '*.cjs';

função soma(a, b) {
  retornar a + b
}
módulo.exportações = {
  soma
}
//index.js
importar utilitários de './utils.js'

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

3. Marque os arquivos de entrada de diferentes módulos através do campo exports de package.json (esta também é uma prática comum para a maioria das bibliotecas de terceiros, por exemplo,

// package. json
"exportações": {
  "importar": "./index.js",
  "require": "./index.cjs"
}

Registro de pergunta

1. Como o nodejs lida com arquivos de sufixo .mjs/.cjs?

O Nodejs sempre carrega arquivos .mjs com o módulo esmodule e arquivos .cjs com commonjs. Quando package.json é definido como tipo: "module", os arquivos .js são sempre carregados como esmodule.