Webpack - Jquery Двойная декларация "$"

Question

Я запускаю самую подходящую программу Symfony с веб-пакетом и Symfony 4.

Я хочу использовать Materialise и jquery на своем веб-сайте.

Итак, я запустил:

пряжа добавить материал-css

пряжа добавить jquery

Вот мой app.js

import "../scss/main.scss"
import M from "materialize-css/dist/js/materialize.min.js"
import $ from "jquery"

/*
 * Welcome to your app's main JavaScript file!
 *
 * We recommend including the built version of this JavaScript file
 * (and its CSS file) in your base layout (base.html.twig).
 */

// any CSS you require will output into a single css file (app.css in this case)

// Need jQuery? Install it with "yarn add jquery", then uncomment to require it.
 var $ = require('jquery');

Когда я запускаю:

пряжа на бис dev - watch

У меня следующая ошибка

Module build failed (from ./node_modules/babel-loader/lib/index.js):
TypeError: /home/vagrant/code/assets/js/app.js: Duplicate declaration "$"
  13 |
  14 | // Need jQuery? Install it with "yarn add jquery", then uncomment to require it.
> 15 |  var $ = require('jquery');
     |      ^
  16 |
  17 | console.log('Hello Webpack Encore! Edit me in assets/js/app.js');
  18 |
    at File.buildCodeFrameError (/home/vagrant/code/node_modules/@babel/core/lib/transformation/file/file.js:261:12)
    at Scope.checkBlockScopedCollisions (/home/vagrant/code/node_modules/@babel/traverse/lib/scope/index.js:347:22)
    at Scope.registerBinding (/home/vagrant/code/node_modules/@babel/traverse/lib/scope/index.js:504:16)
    at Scope.registerDeclaration (/home/vagrant/code/node_modules/@babel/traverse/lib/scope/index.js:444:14)
    at Object.Declaration (/home/vagrant/code/node_modules/@babel/traverse/lib/scope/index.js:125:12)
    at NodePath._call (/home/vagrant/code/node_modules/@babel/traverse/lib/path/context.js:53:20)
    at NodePath.call (/home/vagrant/code/node_modules/@babel/traverse/lib/path/context.js:40:17)
    at NodePath.visit (/home/vagrant/code/node_modules/@babel/traverse/lib/path/context.js:88:12)
    at TraversalContext.visitQueue (/home/vagrant/code/node_modules/@babel/traverse/lib/context.js:118:16)
    at TraversalContext.visitMultiple (/home/vagrant/code/node_modules/@babel/traverse/lib/context.js:85:17)
    at TraversalContext.visit (/home/vagrant/code/node_modules/@babel/traverse/lib/context.js:144:19)
    at Function.traverse.node (/home/vagrant/code/node_modules/@babel/traverse/lib/index.js:94:17)
    at traverse (/home/vagrant/code/node_modules/@babel/traverse/lib/index.js:76:12)
    at NodePath.traverse (/home/vagrant/code/node_modules/@babel/traverse/lib/path/index.js:161:24)
    at Scope.crawl (/home/vagrant/code/node_modules/@babel/traverse/lib/scope/index.js:684:10)
    at Scope.init (/home/vagrant/code/node_modules/@babel/traverse/lib/scope/index.js:634:32)
    at NodePath.setScope (/home/vagrant/code/node_modules/@babel/traverse/lib/path/context.js:126:30)
    at NodePath.setContext (/home/vagrant/code/node_modules/@babel/traverse/lib/path/context.js:141:8)
    at new File (/home/vagrant/code/node_modules/@babel/core/lib/transformation/file/file.js:104:8)
    at normalizeFile (/home/vagrant/code/node_modules/@babel/core/lib/transformation/normalize-file.js:141:10)
    at runSync (/home/vagrant/code/node_modules/@babel/core/lib/transformation/index.js:44:43)
    at runAsync (/home/vagrant/code/node_modules/@babel/core/lib/transformation/index.js:35:14)
    at process.nextTick (/home/vagrant/code/node_modules/@babel/core/lib/transform.js:34:34)
    at process._tickCallback (internal/process/next_tick.js:61:11)

Entrypoint app = app.js

Я бы хотел сказать, что мой IDE не обнаружил Материализацию..

Как это исправить?