TypeError: cosmiconfig_1.cosmiconfigSync is not a function

[ljquan]

Version

4.5.8

Reproduction link

https://github.com/ljquan/vue3.git

Environment info

  System:
    OS: macOS 10.15.6
    CPU: (8) x64 Intel(R) Core(TM) i7-6700K CPU @ 4.00GHz
  Binaries:
    Node: 10.16.0 - /usr/local/bin/node
    Yarn: 1.22.10 - /usr/local/bin/yarn
    npm: 6.4.1 - /usr/local/bin/npm
  Browsers:
    Chrome: 86.0.4240.111
    Edge: Not Found
    Firefox: Not Found
    Safari: 13.1.2
  npmPackages:
    @vue/babel-helper-vue-jsx-merge-props:  1.2.1 
    @vue/babel-helper-vue-transform-on:  1.0.0-rc.2 
    @vue/babel-plugin-jsx:  1.0.0-rc.3 
    @vue/babel-plugin-transform-vue-jsx:  1.2.1 
    @vue/babel-preset-app:  4.5.8 
    @vue/babel-preset-jsx:  1.2.3 
    @vue/babel-sugar-composition-api-inject-h:  1.2.1 
    @vue/babel-sugar-composition-api-render-instance:  1.2.1 
    @vue/babel-sugar-functional-vue:  1.2.2 
    @vue/babel-sugar-inject-h:  1.2.2 
    @vue/babel-sugar-v-model:  1.2.3 
    @vue/babel-sugar-v-on:  1.2.3 
    @vue/cli-overlay:  4.5.8 
    @vue/cli-plugin-babel: ~4.5.0 => 4.5.8 
    @vue/cli-plugin-eslint: ~4.5.0 => 4.5.8 
    @vue/cli-plugin-pwa: ~4.5.0 => 4.5.8 
    @vue/cli-plugin-router: ~4.5.0 => 4.5.8 
    @vue/cli-plugin-typescript: ~4.5.0 => 4.5.8 
    @vue/cli-plugin-unit-jest: ~4.5.0 => 4.5.8 
    @vue/cli-plugin-vuex: ~4.5.0 => 4.5.8 
    @vue/cli-service: ~4.5.0 => 4.5.8 
    @vue/cli-shared-utils:  4.5.8 
    @vue/compiler-core:  3.0.2 
    @vue/compiler-dom:  3.0.2 
    @vue/compiler-sfc: ^3.0.0 => 3.0.2 
    @vue/compiler-ssr:  3.0.2 
    @vue/component-compiler-utils:  3.2.0 
    @vue/eslint-config-prettier: ^6.0.0 => 6.0.0 
    @vue/eslint-config-typescript: ^5.0.2 => 5.1.0 
    @vue/preload-webpack-plugin:  1.1.2 
    @vue/reactivity:  3.0.2 
    @vue/runtime-core:  3.0.2 
    @vue/runtime-dom:  3.0.2 
    @vue/shared:  3.0.2 
    @vue/test-utils: ^2.0.0-0 => 2.0.0-beta.7 
    @vue/web-component-wrapper:  1.2.0 
    eslint-plugin-vue: ^7.0.0-0 => 7.1.0 
    jest-serializer-vue:  2.0.2 
    typescript: ~3.9.3 => 3.9.7 
    vue: ^3.0.0 => 3.0.2 
    vue-eslint-parser:  7.1.1 
    vue-hot-reload-api:  2.3.4 
    vue-jest: ^5.0.0-0 => 5.0.0-alpha.5 (3.0.7)
    vue-loader:  16.0.0-beta.9 (15.9.4)
    vue-router: ^4.0.0-0 => 4.0.0-rc.1 
    vue-style-loader:  4.1.2 
    vue-template-es2015-compiler:  1.9.1 
    vuex: ^4.0.0-0 => 4.0.0-beta.4 
  npmGlobalPackages:
    @vue/cli: 4.5.8

Steps to reproduce

vue create vue3
npm i postcss-px2rem-options
npm run serve

What is expected?

can run

What is actually happening?

break

[fangbinwei]

Use CommonJS in postcss.config.js ?

// eslint-disable-next-line @typescript-eslint/no-var-requires
const px2remOptions = require("postcss-px2rem-options"); // or eslintignore

module.exports = () => ({
  plugins: [
    px2remOptions([
      {
        remUnit: 20,
        include: /src/i
      }
    ])
  ]
});

[ljquan]

Even deleting postcss.config.js is the same

[fangbinwei]

Could you try to delete yarn.lock, package-lock.json, node_module, and reinstall the dependencies only with npm oryarn? maybe related to an optional dep fork-ts-checker-webpack-plugin-v5 which depends on cosmiconfig@^6.0.0

cosmiconfigSync is provided by cosmiconfig@^6.0.0, I can't find it in your package-lock.json,

[fangbinwei]

I found that vue create a project with yarn, then npm i postcss-px2rem-options will cause some problems.(some files in node_modules are missing). Don't use both npm and yarn in project.