Javascript 为什么我的Symfony页面特定脚本无法工作？
我第一次使用symfony，并在其最后一个版本（即5）中使用它 我设法编码了一个多文件上传，它工作正常。但是，在选择文件时，文件类型字段中不会显示任何内容，即不会显示所选文件的编号或名称。在网上做一些搜索，我发现我需要做一些Java脚本来解决这个问题。此外，由于我想添加进度条，javascript变得非常必要。 问题是我无法让JQuery和Javascript在页面上工作 这就是我所做的 webpack.config.js删除大多数注释以缩短文件Javascript 为什么我的Symfony页面特定脚本无法工作？,javascript,jquery,symfony,Javascript,Jquery,Symfony,我第一次使用symfony，并在其最后一个版本（即5）中使用它 我设法编码了一个多文件上传，它工作正常。但是，在选择文件时，文件类型字段中不会显示任何内容，即不会显示所选文件的编号或名称。在网上做一些搜索，我发现我需要做一些Java脚本来解决这个问题。此外，由于我想添加进度条，javascript变得非常必要。 问题是我无法让JQuery和Javascript在页面上工作 这就是我所做的 webpack.config.js删除大多数注释以缩短文件 var Encore = require('@s
var Encore = require('@symfony/webpack-encore');
if (!Encore.isRuntimeEnvironmentConfigured()) {
Encore.configureRuntimeEnvironment(process.env.NODE_ENV || 'dev');
}
Encore
.setOutputPath('public/build/')
.setPublicPath('/build')
.copyFiles({
from: './assets/images',
})
/*
* ENTRY CONFIG
*/
.addEntry('app', './assets/js/app.js')
.addEntry('upload', './assets/js/upload.js')
.splitEntryChunks()
.enableSingleRuntimeChunk()
/*
* FEATURE CONFIG
*/
.cleanupOutputBeforeBuild()
.enableBuildNotifications()
.enableSourceMaps(!Encore.isProduction())
.enableVersioning(Encore.isProduction())
.configureBabelPresetEnv((config) => {
config.useBuiltIns = 'usage';
config.corejs = 3;
})
// enables Sass/SCSS support
.enableSassLoader()
// uncomment if you're having problems with a jQuery plugin
.autoProvidejQuery()
;
module.exports = Encore.getWebpackConfig();
<!-- <!DOCTYPE html> -->
<html>
<head>
<meta charset="UTF-8" />
<title>
{% block title %}
Welcome!
{% endblock %}
</title>
{% block stylesheets %}
{# 'app' must match the first argument to addEntry() in webpack.config.js #}
{{ encore_entry_link_tags('app') }}
{% endblock %}
</head>
<body>
{% include 'topbar.html.twig' %}
{% include 'banner.html.twig' %}
{% include 'menubar.html.twig' %}
{% include 'slogan.html.twig' %}
{% include 'flashmessages.html.twig' %}
<div class="container my-content">
{% block body %} {% endblock %}
</div>
{% include 'footer.html.twig' %}
{% block javascripts %} {% endblock %}
</body>
</html>
yarn encore dev
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([["upload"],{
/***/ "./assets/js/upload.js":
/*!*****************************!*\
!*** ./assets/js/upload.js ***!
\*****************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var $ = __webpack_require__(/*! jquery */ "./node_modules/jquery/dist/jquery.js");
$(document).ready(function () {
//bsCustomFileInput.init();
console.log('document ready');
alert('loaded');
});
/***/ })
},[["./assets/js/upload.js","runtime","vendors~app~upload"]]]);
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIndlYnBhY2s6Ly8vLi9hc3NldHMvanMvdXBsb2FkLmpzIl0sIm5hbWVzIjpbIiQiLCJyZXF1aXJlIiwiZG9jdW1lbnQiLCJyZWFkeSIsImNvbnNvbGUiLCJsb2ciLCJhbGVydGUiXSwibWFwcGluZ3MiOiI7Ozs7Ozs7OztBQUFBLElBQU1BLENBQUMsR0FBR0MsbUJBQU8sQ0FBQyxvREFBRCxDQUFqQjs7QUFDQUQsQ0FBQyxDQUFDRSxRQUFELENBQUQsQ0FBWUMsS0FBWixDQUFrQixZQUFXO0FBQ3pCO0FBQ0FDLFNBQU8sQ0FBQ0MsR0FBUixDQUFZLGdCQUFaO0FBQ0FDLFFBQU0sQ0FBQyxRQUFELENBQU47QUFDSCxDQUpELEUiLCJmaWxlIjoidXBsb2FkLmpzIiwic291cmNlc0NvbnRlbnQiOlsiY29uc3QgJCA9IHJlcXVpcmUoJ2pxdWVyeScpO1xuJChkb2N1bWVudCkucmVhZHkoZnVuY3Rpb24oKSB7XG4gICAgLy9ic0N1c3RvbUZpbGVJbnB1dC5pbml0KCk7XG4gICAgY29uc29sZS5sb2coJ2RvY3VtZW50IHJlYWR5Jyk7XG4gICAgYWxlcnRlKCdsb2FkZWQnKTtcbn0pIl0sInNvdXJjZVJvb3QiOiIifQ==
<script src="/build/upload.js><script>
我需要帮助。在你的小树枝模板中，你需要包含CSS和JS的encore标签 我看到你添加了{{encore_entry_link_tags'app'}} 但是我没有看到JS条目的标签 {{encore_entry_script_tags'app'}或{{{encore_entry_script_tags'upload'}} 可能它包含在您的footer.html.twig中，但我们在这里没有看到 希望这有帮助 编辑： 既然您找到了答案，我想我们可以通过深入了解如何找到隐藏的Javascript错误来解决这个问题 首先，尝试使用其他浏览器。在过去，我的JS有一个错误，在chrome控制台上看不到，但我可以在Firefox上看到 您可以尝试使用chrome的调试器，添加一个断点，然后逐步执行。 或者使用Firefox的
如果没有任何结果，问题可能在其他地方。事实上，上传页面特有的js标签被添加到页面的javascripts块中。我最终发现，基本模板中javascripts块中的注释是问题的根源，但在复制此模板时，我删除了没有人能看到的注释信息技术在真实模板中删除这些评论解决了这个问题。谢谢你的帮助。我很想知道我的建议是否会发现你的错误。请你试一试好吗？如果你这样做，你会认为我的答案是一个决议吗？
<script src="/build/upload.js><script>