Search code examples
javascripttypescriptwebpackts-node

How to save WebPack output files to another place automatically after my project is built


We have a SDK project witch is depended by another two projects.

When we want to build whole application, firstly, we need to build SDK project and upload it. Then we can build another two projects after run npm install.

This time I want to add a script for developer. When I run the script in SDK project it I can save the built output files to another projects node_modules.

Here is my code.

package.json file:

{
  ...
  "scripts": {
    "build:dev": "webpack --mode=development",
    ...
  }
  ...
}

webpack.config.js file:

let config = {
  ...
  module: {
    rules: [
      {
        test:/\.tsx?$/,
        use: 'ts-loader',
        exclude: /node_modules/
      }
    ]
  }
  ...
}

module.exports = (env, argv) => {
  if(argv.mode === 'development') {
    // We put all the projects in one repo
    config.output.path = path.resolve(__dirname,'../another-project/node_modules/sdk/dist/bundle')
  }
}

And at last we set outDir in tsconfig.json.

The problem is:

  • How to change the output file path for typescript declaration files by WebPack arguments?
  • How to save all the file to two places one time?

I figure out the last problem by using webpack -env xxx && webpack -env xxx. I just run script twice, maybe someone has better idear.

Now just one qusetion:

  • How to set the output file path for typescript declaration files dynamically?

Solution

  • webpack.config.js file:

    let config = {
      ...,
      module: {
        rules: [
          {
            test:/\.tsx?$/,
            use: 'ts-loader',
            options: {
              configFile: "tsconfig.server.json"
            }
          }
        ]
      },
      ...
    }
    

    Then I can change configFlie in webpack module.