vue cli converts all js files to typescript when adding a new plugin

[jacekkarczmarczyk]

Version

4.5.7

Reproduction link

https://github.com/jacekkarczmarczyk/vue-cli-bug-files

Environment info

  System:
    OS: Windows 10 10.0.18362
    CPU: (12) x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
  Binaries:
    Node: 12.10.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.19.0 - ~\AppData\Roaming\npm\yarn.CMD
    npm: 6.10.3 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Chrome: 85.0.4183.121
    Edge: Spartan (44.18362.449.0)
  npmPackages:
    @vue/babel-helper-vue-jsx-merge-props:  1.0.0
    @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.1.2
    @vue/babel-preset-app:  4.5.7
    @vue/babel-preset-jsx:  1.1.2
    @vue/babel-sugar-functional-vue:  1.1.2
    @vue/babel-sugar-inject-h:  1.1.2
    @vue/babel-sugar-v-model:  1.1.2
    @vue/babel-sugar-v-on:  1.1.2
    @vue/cli-overlay:  4.5.7
    @vue/cli-plugin-babel: ~4.5.0 => 4.5.7
    @vue/cli-plugin-eslint: ~4.5.0 => 4.5.7
    @vue/cli-plugin-router:  4.5.7
    @vue/cli-plugin-typescript: ~4.5.0 => 4.5.7
    @vue/cli-plugin-unit-jest: ~4.5.0 => 4.5.7
    @vue/cli-plugin-vuex:  4.5.7
    @vue/cli-service: ~4.5.0 => 4.5.7
    @vue/cli-shared-utils:  4.5.7
    @vue/component-compiler-utils:  3.2.0
    @vue/eslint-config-standard: ^5.1.2 => 5.1.2
    @vue/eslint-config-typescript: ^5.0.2 => 5.1.0
    @vue/preload-webpack-plugin:  1.1.2
    @vue/test-utils: ^1.0.3 => 1.1.0
    @vue/web-component-wrapper:  1.2.0
    eslint-plugin-vue: ^6.2.2 => 6.2.2
    jest-serializer-vue:  2.0.2
    typescript: ~3.9.3 => 3.9.7
    vue: ^2.6.11 => 2.6.12
    vue-eslint-parser:  7.1.0
    vue-hot-reload-api:  2.3.4
    vue-jest:  3.0.7
    vue-loader:  15.9.3 (16.0.0-beta.8)
    vue-router:  3.4.6
    vue-style-loader:  4.1.2
    vue-template-compiler: ^2.6.11 => 2.6.12
    vue-template-es2015-compiler:  1.9.1
  npmGlobalPackages:
    @vue/cli: Not Found

Steps to reproduce

clone repo, add a plugin (for example vue add router)

What is expected?

.js files stay .js

What is actually happening?

.js files are converted to .ts

---

It's related to https://github.com/vuejs/vue-cli/issues/2676 However while adding a typescript plugin converting js files to ts might be justified then IMHO it doesn't seem to be the good behaviour when i'm adding unrelated plugins

[liamrota]

this is also happening for me when running 'vue add pwa'

[AndreiSoroka]

I have custom preset with templates

after vue create I have same bug:

If a file was exist, so working ok

If it is new file then you have bug with rename js to ts

[AndreiSoroka]

my temp solution for my case

  api.render('./template');
  api.postProcessFiles(function (files) {
    const fs = require('fs');
    const path = require('path');
    const getFiles = require('./utils/getFiles');

    // get files from ./templates
    const templatePath = path.resolve(__dirname, './template');
    const filesFromTemplate = getFiles(templatePath)
      .map(
        file => file
          .replace(`${templatePath}/`, '')
          .replace(/^__/g, '_')
          .replace(/^_/g, '.'),
      );

    // remove from common list and manual save
    for (const path of filesFromTemplate) {
      if (!files[path]) {
        throw new Error(`Not found ${path} from templates`)
      }
      fs.mkdirSync(api.resolve(path, '../'), { recursive: true });
      fs.writeFileSync(api.resolve(path), files[path], { encoding: 'utf-8' })
      delete files[path];
    }
  });

[gavmck]

Also seeing this when doing vue add pwa, that seems a bit overboard hey!