Question

如何在/ vendor文件夹中包含资源，以便我可以在全局使用它？

我的base.html.twig：

<script src="{{ asset('build/vendor.js') }}"></script>
<script src="{{ asset('build/color-admin.js') }}"></script>
<script src="{{ asset('build/app.js') }}"></script>

<script>
    $(document).ready(function() {
        App.init();
    });
</script>

在我的webpack.config中，我有：

.addEntry('color-admin', [
    onePageJSFolder + '/apps.js',
    onePageCSSFolder + '/animate.css',
    onePageCSSFolder + '/style.css',
    onePageCSSFolder + '/style-responsive.css',
    onePageCSSFolder + '/theme/orange.css',
])

其中onePageJSVolder是/ vendor文件夹的有效网址：

var frontend = './vendor/suvya/color-admin-3/frontend';
var onePage = frontend + '/one-page-parallax/template_content_html';
var onePageAssetsFolder = onePage + '/assets';
var onePagePluginsFolder = onePageAssetsFolder + '/plugins';
var onePageCSSFolder = onePageAssetsFolder + '/css';
var onePageLessFolder = onePageAssetsFolder + '/less';
var onePageJSFolder = onePageAssetsFolder + '/js';

但我收到错误App未定义。（来自base.html.twig）。应用程序在apps.js中声明但未在全局范围内识别。

如何解决这个问题？

我正在运行Symfony-BETA4

Answer 1

对base.html.twig使用唯一的createSharedEntry可能会更好吗？看看我的反应应用示例：

.createSharedEntry('vendor', [
    'jquery',
    'bootstrap',
    'react',
    'react-dom',
    './node_modules/bootstrap/scss/bootstrap.scss'
])

它将生成三个文件，vandor.css，vendor.js和manifest.js。这个流程在documentation中描述，并且关于您的问题：inside Webpack, when you require a module, it does not (usually) set a global variable. Instead, it just returns a value:您需要检查全局变量。查看使用全局变量解决jQuery问题的this example，也许它会对您有所帮助。我认为您需要将autoProvideVariables添加到您的webpack.config.js

Webpack Encore：如何在/ vendor中包含js并在全球范围内使用？

1 个答案: