TypeScript migration woes (webpack can't resolve plugins, store, etc in entry.js)



  • Hello,
    I decided to migrate my project to TypeScript, so I followed all the steps for migrating a Vue project to TS, but now I ran into a webpack issue:

    $ quasar build
     app:build Mode [ SPA ] with [ MAT ] theme +0ms
    
     app:quasar-conf Reading quasar.conf.js +362ms
     app:quasar-conf Generating Webpack config +194ms
     app:quasar-conf Extending Webpack config +458ms
     app:artifacts Cleaned build artifact: "/home/t/cis/cis-dashboard-app/dist/spa-mat" +5ms
     app:generator Generating Webpack entry point +0ms
     app:build Building main... +2ms
    
    Starting type checking service...
    Using 1 worker with 2048MB memory limit
    Build completed in 9.11s
    
    /* snip */
    
    ERROR in ./.quasar/entry.js
    Module not found: Error: Can't resolve '../src/router' in '/my/app/.quasar'
     @ ./.quasar/entry.js 25:37-61
     @ multi ./.quasar/entry.js
    
    ERROR in ./.quasar/entry.js
    Module not found: Error: Can't resolve 'src/plugins/auth' in '/my/app/.quasar'
     @ ./.quasar/entry.js 27:35-62
     @ multi ./.quasar/entry.js
    
    ERROR in ./.quasar/entry.js
    Module not found: Error: Can't resolve 'src/plugins/axios' in '/my/app/.quasar'
     @ ./.quasar/entry.js 29:36-64
     @ multi ./.quasar/entry.js
    
    ERROR in ./.quasar/entry.js
    Module not found: Error: Can't resolve 'src/plugins/cordova-etc' in '/my/app/.quasar'
     @ ./.quasar/entry.js 35:41-75
     @ multi ./.quasar/entry.js
    
    ERROR in ./.quasar/entry.js
    Module not found: Error: Can't resolve 'src/plugins/i18n' in '/my/app/.quasar'
     @ ./.quasar/entry.js 31:35-62
     @ multi ./.quasar/entry.js
    
    ERROR in ./.quasar/entry.js
    Module not found: Error: Can't resolve 'src/plugins/notifications' in '/my/app/.quasar'
     @ ./.quasar/entry.js 33:44-80
     @ multi ./.quasar/entry.js
    
     app:build [FAIL] Build failed with errors +0ms
    

    The entry.js file (which is apparently generated somewhere in the build process by quasar?) is still a .js file, and thus the plugin imports:

    import pluginAuth from 'src/plugins/auth'
    plugins.push(pluginAuth)
    

    and other imports fail.

    The relevant portion of my quasar.conf.js is:

    extendWebpack (cfg) {
        cfg.module.rules.push({
          enforce: 'pre', // tried both with and without, no luck
          test: /\.ts$/,
          loader: 'ts-loader',
          options: {
            appendTsSuffixTo: [/\.vue$/],
            transpileOnly: true
          }
        })
        cfg.plugins.push(new ForkTsCheckerWebpackPlugin())
        // disabled temporarily eslint before I get this mess of a build process working
        // cfg.module.rules.push({
        //   enforce: 'pre',
        //   test: /\.(js|vue)$/,
        //   loader: 'eslint-loader',
        //   exclude: /(node_modules|quasar|src-cordova)/
        // })
    }
    

    Any ideas how to get the build to work? Thanks!



  • This post is deleted!