当我将 jquery 添加到我的网站时，我的 JS 不起作用

Question

我正在 Symfony 中用 encore 和 yarn 做一个脚本 JS，当我不使用 jquery 并且从不需要他时，我的 JS 工作正常。但是目前我添加了 jquery，const $ = require('jquery')例如我的脚本不起作用并且我没有收到错误消息。我尝试评论.enableSingleRuntimeChunk()，使用 CDN 添加 jquery，尝试另一个项目。没变化。//base.html.twig{% block javascripts %}            <script src="{{ asset('build/runtime.js') }}"></script>            <script src="{{ asset('build/app.js') }}" type="text/javascript"></script>{% endblock %}// Need jQuery? Install it with "yarn add jquery", then uncomment to require it.const $ = require('jquery');console.log('hello');Encore    // directory where compiled assets will be stored    .setOutputPath('public/build/')    .copyFiles({        from: './assets/images'    })    // public path used by the web server to access the output path    .setPublicPath('/build')    // only needed for CDN's or sub-directory deploy    //.setManifestKeyPrefix('build/')    /*     * ENTRY CONFIG     *     * Add 1 entry for each "page" of your app     * (including one that's included on every page - e.g. "app")     *     * Each entry will result in one JavaScript file (e.g. app.js)     * and one CSS file (e.g. app.fontawesome) if your JavaScript imports CSS.     */    .addEntry('app', './assets/js/app.js')    .addEntry('main', './assets/js/main.js')    //.addEntry('page2', './assets/js/page2.js')    // When enabled, Webpack "splits" your files into smaller pieces for greater optimization.    .splitEntryChunks()    // will require an extra script tag for runtime.js    // but, you probably want this, unless you're building a single-page app    .enableSingleRuntimeChunk()

Answer 1

在 webpack.config.js 中尝试使用：

.autoProvidejQuery()

取消注释（如果您已发表评论）

.enableSingleRuntimeChunk()

并删除

.autoProvidejQuery({

    $: 'jquery',

    jQuery: 'jquery',

    'window.jQuery': 'jquery'

})

在 app.js 中注释//const $ = require('jquery');并使用 jquery

在 base.html.twig 中使用

{% block javascripts %}

       {{ encore_entry_script_tags('app') }}

{% endblock %}

最后运行yarn encore dev（对于 dev env）或 yarn encore prod（对于 prod env）并重新加载页面