webpack+typescript how to leave an import until runtime?

Viewed 11

I'm developing some code to run on wix-velo. There are various wix-velo libraries that you can import, e.g.

import * as whf from 'wix-http-functions';

I have created a .d.ts file for this so my code looks like

/// <reference path="../types/wix-http-functions.d.ts"/>
import * as whf from 'wix-http-functions';

and vscode is happy with this but webpack is not happy because it cannot resolve wix-http-functions.

How do I tell webpack that it doesn't need to bundle wix-http-functions, that it should just leave that import statement untouched? This seems related to either lazy loading or code-splitting but I can't figure out from those docs how to tell webpack (or ts-loader?) that this import will come from outside.

Here's my webpack.config.js . Thanks.

const path = require('path');

module.exports = {
  entry: {
    calendar: './ts/calendar.ts',
    poster: './ts/html/poster.ts',
    mailchimp: './ts/mailchimp.ts',
    tcb: './ts/wix/tcb.ts',
    zaikoInject: './ts/zaiko-inject.ts',
  },
  devtool: 'inline-source-map',
  module: {
    rules: [
      {
        test: /\.tsx?$/,
        use: 'ts-loader',
        include: path.resolve(__dirname, "ts"),
      },
    ],
  },
  resolve: {
    extensions: ['.tsx', '.ts', '.js'],
  },
  output: {
    library: {
      name: '[name]',
      type: 'var',
    },
    filename: '[name].js',
    path: path.resolve(__dirname, 'dist'),
  },
  "optimization": {
    "minimize": false,
    usedExports: true,
  },
  mode: "development",
};
0 Answers
Related