symfony / webpack-encore-bundle

Symfony integration with Webpack Encore!
https://symfony.com/webpack-encore
MIT License
940 stars 83 forks source link

assets base_path parameter not considered by encore_entry_link_tags and encore_entry_script_tags functions #222

Open barbuslex opened 1 year ago

barbuslex commented 1 year ago

Hi,

I have this config in a template bundle : webpack.config.js

Encore
    .setOutputPath('./src/Resources/public/')
    .setPublicPath('')
    .setManifestKeyPrefix('')

    .addEntry('coloradmin', './assets/coloradmin.js')
    .disableSingleRuntimeChunk()
    .cleanupOutputBeforeBuild()
    .enableSourceMaps(false)
    .enableVersioning(true)

    .configureBabel((config) => {
        config.plugins.push('@babel/plugin-proposal-class-properties');
    })
    .configureBabelPresetEnv((config) => {
        config.useBuiltIns = 'usage';
        config.corejs = 3;
    })
    .enableSassLoader()
    .autoProvideVariables()
    .addPlugin(new CopyPlugin({
        patterns: [
            { from: "assets/img/", to: "images" },
        ]
    }))

    .addLoader({
        test: require.resolve('pace-js'),
        use: [{
            loader: 'imports-loader',
            options: {
                additionalCode: 'var define = false;'
            }
        }]
    });

;

module.exports = Encore.getWebpackConfig();
module.exports.output.publicPath = '';

webpack_encore.yaml

parameters: 
  color_admin.builds_path: '%kernel.project_dir%/public/bundles/coloradmin'
  color_admin.json_manifest_path: '%kernel.project_dir%/public/bundles/coloradmin/manifest.json'

webpack_encore:
  builds:
    coloradmin: '%color_admin.builds_path%'

framework:
  assets:
    packages:
      coloradmin:
          base_path: '%env(WEBPACK_PUBLIC_PATH)%bundles/coloradmin/'
          json_manifest_path: '%color_admin.json_manifest_path%'

When i use {{ asset('coloradmin.css', 'coloradmin') }} the path generated is /bundles/coloradmin/coloradmin.464b2fc0.css. When i use {{ encore_entry_link_tags('coloradmin.css', null, 'coloradmin') the path generated is /coloradmin.464b2fc0.css.

Same with scripts tags/functions.

Have you a workaround for considering base_path parameter with webpack encore functions ? (i need to use env variable from parent root project (inexist env in bundle)).

Thanks

weaverryan commented 1 year ago

Hi!

Yea, your setup is a bit more complex :). Have you tried the 2nd argument to encore_entry_link_tags()? That is the asset package name - so try passing coloradmin there: https://github.com/symfony/webpack-encore-bundle/blob/2.x/src/Twig/EntryFilesTwigExtension.php#L57C21-L57C42

Also, you could try calling the encore_entry_css_files() Twig function instead, looping over it, and using the asset() function manually on those. I believe the CSS files in that loop will start with a /, so I think you may need to strip the starting / off so that the asset() function does its normal job.

barbuslex commented 1 year ago

Hi @weaverryan, thanks for you reply...

It seems to me that I had an error like "the package name coloradmin does not exist" or something like this. I followed the documentation (https://symfony.com/doc/current/frontend/encore/advanced-config.html#defining-multiple-webpack-configurations) for this setup.

I'll test your solution tomorrow to see...

barbuslex commented 1 year ago

Hi @weaverryan,

I have tested by replacing {{ asset('coloradmin.js', 'coloradmin')}} by encore_entry_link_tags('coloradmin', 'coloradmin'), here the error : image

But with encore_entry_link_tags('coloradmin', 'coloradmin', 'coloradmin') it's works very well, i don't understand why ^^

Thanks

lhapaipai commented 11 months ago

Hi @barbuslex, Your configuration is somewhat confusing because you defined a build folder name that is the same as your entry point and your asset package name. If you take a look at : https://github.com/symfony/webpack-encore-bundle/blob/2.x/src/Twig/EntryFilesTwigExtension.php#L51

I think it's

{{ encore_entry_link_tags('coloradmin', 'coloradmin', 'coloradmin') }}
{{ encore_entry_script_tags('coloradmin', 'coloradmin', 'coloradmin') }} 

the third parameter is your entrypointName -> coloradmin instead _default. which explains why it looks for your entrypoints.json file in public/build which is the default directory instead of the directory you defined %kernel.project_dir%/public/bundles/coloradmin

barbuslex commented 11 months ago

Hi @lhapaipai,

Thanks you for your reply... I think I'm starting to understand... How can I enter a packageName as coloradmin and leave the entrypoint as _default ?

Thanks