Update main.js in your src folder with following content:
exportfunctionconfigure(aurelia) {// These variables are only here to be able to distinguish between the two// installation options presented above.// Of course you can use the correct name directly in the import below.let materialize ='materialize'; // ONLY when using the "github" option abovelet materialize ='materialize-css'; // ONLY when using the "npm" option abovereturnaurelia.loader.loadModule(materialize).then(() => {aurelia.use.standardConfiguration().developmentLogging()// Install and configure the plugin.plugin('aurelia-materialize-bridge', bridge =>bridge.useAll() );returnaurelia.start().then(a =>a.setRoot()); }}
Please make sure that you use only one of the imports shown above.
Note: You could just import 'materialize' into your app but since Materialize is not a direct dependency of this bridge anymore, it may get loaded asynchronously. This may lead to Materialize being initialized after components are attached() which essentally applies Materialize twice.
Note: The above shows how to use all available controls at once. If you choose to pick which you'd like to use, you can use single components like this: