Why template literals in JS code do not work anymore

package.json has :

{
    "private": true,
    "scripts": {
        "dev": "npm run development",
        "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
        "watch": "npm run development -- --watch",
        "watch-poll": "npm run watch -- --watch-poll",
        "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
        "prod": "npm run production",
        "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
    },
    "devDependencies": {
        "axios": "^0.19.2",
        "bootstrap": "^4.1.0",
        "cross-env": "^5.1",
        "jquery": "^3.5.1",
        "laravel-mix": "^4.0.7",
        "lodash": "^4.17.13",
        "popper.js": "^1.12",
        "resolve-url-loader": "^2.3.1",
        "sass": "^1.15.2",
        "sass-loader": "^7.1.0",
        "vue": "^2.5.17",
        "vue-template-compiler": "^2.6.11"
    },
    "dependencies": {
        "accordion-vue": "^1.0.1",
        "laravel-echo": "^1.9.0",
        "mobile-device-detect": "^0.4.3",
        "moment": "^2.27.0",
        "pusher-js": "^7.0.0",
        "twilio-client": "^1.9.7",
        "twilio-video": "^1.20.1",
        "vue-cute-rate": "^1.0.2",
        "vue-dialog-drag": "^0.1.29",
        "vue-i18n": "^8.17.4",
        "vue-loading-overlay": "^3.3.3",
        "vue-native-websocket": "^2.0.14",
        "vue-simple-alert": "^1.1.1",
        "vue-simple-drawer": "^1.0.6",
        "vuelidate": "^0.7.5",
        "vuex": "^3.1.2"
    }
}

webpack.mix.js :

const mix = require('laravel-mix');

mix.js('resources/js/app.js', 'public/js')
    .sass('resources/sass/app.scss', 'public/css');

Searching in net I found page https://cli.vuejs.org/guide/browser-compatibility.html#polyfills-when-building-as-library-or-web-components with :

With Babel we are able to leverage all the newest language features in ES2015+, but that also means we have to ship transpiled and polyfilled bundles in order to support older browsers. These transpiled bundles are often more verbose than the original native ES2015+ code, and also parse and run slower. Given that today a good majority of the modern browsers have decent support for native ES2015, it is a waste that we have to ship heavier and less efficient code to those browsers just because we have to support older ones.

Vue CLI offers a "Modern Mode" to help you solve this problem. When building for production with the following command:

vue-cli-service build --modern

I am not sure if this option must be used in package.json ? In which way? I continu development of this site after other developer and it was supposed that I got working version of the app ...

Searching for decision I found in yarn.lock lines :

  dependencies:
    consolidate "^0.15.1"
    hash-sum "^1.0.2"
    lru-cache "^4.1.2"
    merge-source-map "^1.1.0"
    postcss "^7.0.14"
    postcss-selector-parser "^6.0.2"
    source-map "~0.6.1"
    vue-template-es2015-compiler "^1.9.0"
  optionalDependencies:
    prettier "^1.18.2"

...
vue-template-es2015-compiler@^1.9.0:
  version "1.9.1"
  resolved "https://registry.yarnpkg.com/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.9.1.tgz#1ee3bc9a16ecbf5118be334bb15f9c46f82f5825"
  integrity sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==

and in file package-lock.json a 101 references of “ES2015” like :

            "requires": {
                ... 
                "vue-template-es2015-compiler": "^1.9.0"
            },
...

                "babel-plugin-check-es2015-constants": {
                    "version": "6.22.0",
                    "resolved": "https://registry.npmjs.org/babel-plugin-check-es2015-constants/-/babel-plugin-check-es2015-constants-6.22.0.tgz",
                    "integrity": "sha1-NRV7EBQm/S/9PaP3XH0ekYNbv4o=",
                    "requires": {
                        "babel-runtime": "^6.22.0"
                    }
                },
                "babel-plugin-transform-es2015-arrow-functions": {
                    "version": "6.22.0",
                    "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-arrow-functions/-/babel-plugin-transform-es2015-arrow-functions-6.22.0.tgz",
                    "integrity": "sha1-RSaSy3EdX3ncf4XkQM5BufJE0iE=",
                    "requires": {
                        "babel-runtime": "^6.22.0"
                    }
                },

I see support of ES2015 in these file and wonder why template literals do not work now ?

Some info is missing. It's hard to help you without the following:

• More code context (show the entire file or the entire relevant code, not just two lines.
• What debug steps have you tried ? Have you tried outputting hard coded values like:

html_item += `<label class='mt-3 mb-0'>${'Hardcoded profession'}</label>`;

// or if the above still doesn't work, did you try the following (hardcoding + regular string)

html_item += '<label class='mt-3 mb-0'>Hardcoded profession</label>';

// If it still doesn't work at this point, your problem is probably related to your variables or elsewhere...

• Do you get errors in the console?
• Does the following pen I made outputs "Hello Mike" on your side. If it does, the problem is not related to your browser settings.