从“物化css”导入{dropdown}解析为“未定义”

我在使用typescript应用程序时遇到问题:

import { Dropdown } from "materialize-css";

document.addEventListener('DOMContentLoaded', function () {

var elems = document.querySelectorAll('.dropdown-trigger');
var instances = Dropdown.init(elems, {});

导致“uncaught typeerror:无法读取未定义的”init“属性 在HTMLdocument。(site.ts:15)加载应用程序时。

有谁能解释出什么事了吗?

其他信息:

package.json包:

{
   "version": "1.0.0",
   "name": "asp.net",
   "private": true,
   "dependencies": {
      "ts-loader": "^4.4.1",
      "vue": "^2.5.16",
      "vue-class-component": "^6.2.0",
      "vue-property-decorator": "^6.1.0",
      "materialize-css": "^0.100.2",
      "@aspnet/signalr": "^1.0.0",
      "webpack": "^4.12.0",
      "webpack-cli": "^3.0.8"
   },
   "devDependencies": {
      "@types/vue": "^2.0.0",
      "@types/materialize-css": "^1.0.3",
      "aspnet-webpack": "^2.0.3",
      "typescript": "^2.9.2",
      "file-loader": "^1.1.11",
      "vue-cli": "^2.9.6",
      "vue-loader": "^15.2.4",
      "vue-template-compiler": "^2.5.16",
      "webpack-hot-middleware": "^2.22.2"
   },
   "scripts": {
      "build": "webpack"
   },
   "-vs-binding": {
       "BeforeBuild": ["build"]
   }

}

tsconfig.json文件:

{
  "compilerOptions": {
     "sourceMap": true,
     "noImplicitReturns": true,
     "noImplicitAny": true,
     "experimentalDecorators": true,
     "emitDecoratorMetadata": true,
     "target": "es6",
     "strict": true,
     "module": "es2015",
     "moduleResolution": "node",
     "lib": [
        "es2016",
        "dom"
      ]
   },
   "typeAcquisition": { "enable": true },
   "include": [
   "app/scripts/**/*"
   ],
   "exclude": [
      "node_modules",
      "wwwroot"
   ],
   "compileOnSave": true
}

和webpack.config.js:

let webpack = require('webpack');
const VueLoaderPlugin = require('vue-loader/lib/plugin');
let path = require('path');

module.exports = {
    mode: 'development',
    entry: {
        site: './app/scripts/site.ts',
        traject: './app/scripts/traject.ts'
    },
    devtool: 'inline-source-map',
    output: {
        path: path.resolve(__dirname, 'wwwroot', 'js'),
        filename: '[name].js',
        publicPath: '/js/'
    },
    module: {
        rules: [
            {
                test: /\.vue$/,
                loader: 'vue-loader'
            },
            {
                test: /\.tsx?$/,
                loader: 'ts-loader',
                exclude: /node_modules/,
                options: { appendTsSuffixTo: [/\.vue$/] }
            }
        ]
    },
    resolve: {
        extensions: ['.tsx', '.ts', '.js'],
        alias: {
            'vue$': 'vue/dist/vue.esm.js'
        }
    },        
    plugins: [
        new VueLoaderPlugin()
    ]
};