Webpack Encore: How to include js from /vendor and use globally?

user_1251070 0
Viewed 4629

How do I include assets from the /vendor folder so that I can use it globally?

my 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>

And in my webpack.config I have:

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

where onePageJSVolder is a valid url to a /vendor folder:

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';

But I am getting the error App is undefined. (coming from base.html.twig). App is declared within apps.js but not recognized globally.

How can this be solved?

I am running Symfony-BETA4

symfony-3.3 webpack-encore symfony4 symfony
2 Answers

Assuming that the package you are using has a Resources\Public folder where the assets are stored you can use the command line:

php bin/console assets:install

By default this will copy all vendors Resource\Public to your web directory. There are more options available in the Symfony Blog covering this. It is considered a Symfony Best Practice to keep all your assets in your web directory. It allows for limited public facing components.

user_65729680
Related