I'm currently working on developing code for wix-velo. In order to do this, I need to import various wix-velo libraries, such as
import * as whf from 'wix-http-functions';
To make sure my code runs smoothly, I've created a .d.ts file which makes my code look like this:
/// <reference path="../types/wix-http-functions.d.ts"/>
import * as whf from 'wix-http-functions';
While vscode seems okay with this setup, webpack is having trouble resolving the wix-http-functions import. How can I instruct webpack not to bundle wix-http-functions, but instead leave the import statement as it is? I believe this may have something to do with lazy loading or code-splitting, but I can't figure out from the documentation how to inform webpack (or ts-loader) that this import will be external.
Below is my webpack.config.js. Any help would be greatly appreciated.
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",
};