Question

我按照文档使Webpack Encore在我的项目中工作。 webpack.config.js中导入的js文件工作正常，但我在页面特定的js中遇到问题：$ is not defined。

Webpack.config.js ：

const Encore = require('@symfony/webpack-encore');
var webpack = require('webpack');

Encore
.setOutputPath('public/build/')
.setPublicPath('http://localhost/tharmo/public/build')
.setManifestKeyPrefix('build/')
.cleanupOutputBeforeBuild()
.enableSourceMaps(!Encore.isProduction())
.autoProvidejQuery()

.createSharedEntry('vendor', [
    './assets/js/custom.js',
    'materialize-css',
])
.addEntry('app', './assets/js/app.js')
.addEntry('statistiques', './assets/js/statistiques.js')
.addPlugin(new webpack.ProvidePlugin({
    $: 'jquery',
    jQuery: 'jquery',
    'window.jQuery': 'jquery',
}))

.enableSassLoader()
;

module.exports = Encore.getWebpackConfig();

base.html.twig ：

<script src="{{ asset('build/manifest.js') }}"></script>
<script src="{{ asset('build/vendor.js') }}"></script>
<script type="text/javascript" src="{{ asset('build/app.js') }}"></script>
<script>
    $(document).ready(function () {
        getNotifications(1);
    });
</script>

$(document).ready无法正常工作。

Answer 1

按照文档：https://symfony.com/doc/current/frontend/encore/legacy-apps.html

了解它

我必须在app.js中写这个：

// require jQuery normally
const $ = require('jquery');

// create global $ and jQuery variables
global.$ = global.jQuery = $;

我从webpack.conig.js中删除了它，因为它等同于.autoProvidejQuery：

.addPlugin(new webpack.ProvidePlugin({
    $: 'jquery',
    jQuery: 'jquery',
    'window.jQuery': 'jquery',
}))

感谢您的帮助！

Answer 2

您应该在webpack.config.js中使用userid date intime inmod outtime outmod ----------- ---------- -------- ----------- -------- ----------- 123 2018-02-02 14:11:14 0 18:52:44 1 123 2018-02-05 09:10:07 0 00:00:00 9配置，并在您的条目js文件中执行以下操作：

从jquery＆＃39;
导入$
...您的公共条目文件代码

export {$};

你会像这样访问jquery：

根。$

Webpack Encore - $未定义

2 个答案: