Webpack + typescript: сохранить тип класса - PullRequest
0 голосов
/ 20 июня 2020

Я использую webpack для сборки библиотеки, написанной на машинописном тексте. Библиотека предназначена для работы на стороне клиента. После проверки документации веб-пакета я создал следующий тест:

основной класс выглядит следующим образом:

import { RenderService } from "./render.service";

export class Grid {

    renderService: RenderService;
    constructor() {
        console.log("constructed");
        this.renderService = new RenderService();
        this.renderService.render();
    }
}

класс обслуживания рендеринга

export class RenderService{
    constructor(){
        
    }
    render(){
        console.log("renderred");
    }
}

tsconfig

{
    "compilerOptions": {
      "outDir": "./dist/",
      "noImplicitAny": true,
      "module": "es6",
      "target": "es5",
      "jsx": "react",
      "allowJs": true
    }
  }

webpack.config. js

const path = require('path');

module.exports = {
  entry: './src/ts/via-grid.ts',
  module: {
    rules: [
      {
        test: /\.tsx?$/,
        use: 'ts-loader',
        exclude: /node_modules/,
      },
    ],
  },
  resolve: {
    extensions: [ '.tsx', '.ts', '.js' ],
  },
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'dist'),
  },
};

Я хочу иметь возможность создать экземпляр класса Grid в сценарии javascript, так что то, что я сделал после использования webpack для создания пакета:

index. html

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" /> 
</head>

<body>
   <!--Some content-->>
</body>
<!--Bundeled solution-->
<script src="../dist/bundle.js"></script>
<script src="./script.js"></script>

</html>

Где script. js это просто:

$(document).ready(function () {
    var vg = new Grid();
});

, и я ожидал консоли для вывода

Constructed Rendrerred

Но вместо этого я получаю

ReferenceError: Grid is not defined

Так в чем же проблема?

...