title: Can you compile a TS file with webpack separately from Vue application?
body: <p>So I have a Vue 3 + Typescript app. <code>npm run build</code> of course takes the app and compiles it into the <code>dist</code> folder so it can be deployed. I have a web worker typescript file that I would like to be compiled separately so that it ends up in the root of the <code>dist</code> folder with the name <code>worker.js</code>. Here is what I'm looking for:</p>
  <pre><code>dist
    |- worker.js
  src
    |- worker.ts // This gets compiled to js file in dist folder
  </code></pre>
  <p>I tried doing this by using webpack's <code>DefinePlugin</code> in my <code>vue.config.js</code> like so:</p>
  <pre><code>const webpack = require('webpack')
  
  module.exports = {
      configureWebpack: {
          plugins: [
              new webpack.DefinePlugin({
                  entry: `${__dirname}/src/worker.ts`,
                  module: {
                      rules: [
                          {
                              test: /worker\.ts$/,
                              use: 'ts-loader',
                              exclude: /node-modules/
                          }
                      ]
                  },
                  resolve: {
                      extensions: ['.ts']
                  },
                  output: {
                      filename: 'worker.js',
                      path: `${__dirname}/dist`
                  }
              })
          ],
          resolve: {
              alias: {
                  vue$: 'vue/dist/vue.esm-bundler.js'
              }
          }
      }
  }
  </code></pre>
  <p>Unfortunately this doesn't work, <code>npm run build</code> just completely ignores the <code>worker.ts</code> file and it doesn't show up in the <code>dist</code> folder anywhere, not even as a chunk. Any suggestions? Or is what I'm wanting to do even possible? Thanks for any help!</p>