vuejs / vue-cli

🛠️ webpack-based tooling for Vue.js Development
https://cli.vuejs.org/
MIT License
29.76k stars 6.33k forks source link

V-bind() in SFC CSS does not work when upgrading Electron version #7444

Open TylerWanta opened 10 months ago

TylerWanta commented 10 months ago

Version

5.0.8

Environment info

System:
    OS: Windows 10 10.0.22621
    CPU: (32) x64 13th Gen Intel(R) Core(TM) i9-13900KF
  Binaries:
    Node: 21.5.0 - C:\Program Files\nodejs\node.EXE
    Yarn: Not Found
    npm: 10.2.4 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Chrome: Not Found
    Edge: Chromium (120.0.2210.91)
  npmPackages:
    @vue/babel-helper-vue-jsx-merge-props:  1.4.0
    @vue/babel-helper-vue-transform-on:  1.1.5
    @vue/babel-plugin-jsx:  1.1.5
    @vue/babel-plugin-transform-vue-jsx:  1.4.0
    @vue/babel-preset-app:  5.0.8
    @vue/babel-preset-jsx:  1.4.0
    @vue/babel-sugar-composition-api-inject-h:  1.4.0
    @vue/babel-sugar-composition-api-render-instance:  1.4.0
    @vue/babel-sugar-functional-vue:  1.4.0
    @vue/babel-sugar-inject-h:  1.4.0
    @vue/babel-sugar-v-model:  1.4.0
    @vue/babel-sugar-v-on:  1.4.0
    @vue/cli-overlay:  5.0.8
    @vue/cli-plugin-babel: ~5.0.0 => 5.0.8
    @vue/cli-plugin-eslint: ~5.0.0 => 5.0.8
    @vue/cli-plugin-router:  5.0.8
    @vue/cli-plugin-typescript: ~5.0.0 => 5.0.8
    @vue/cli-plugin-vuex:  5.0.8
    @vue/cli-service: ~5.0.8 => 5.0.8
    @vue/cli-shared-utils:  5.0.8 (4.5.19)
    @vue/compiler-core:  3.4.5
    @vue/compiler-dom:  3.4.5
    @vue/compiler-sfc:  3.4.5
    @vue/compiler-ssr:  3.4.5
    @vue/component-compiler-utils:  3.3.0
    @vue/eslint-config-typescript: ^9.1.0 => 9.1.0
    @vue/reactivity:  3.4.5
    @vue/runtime-core:  3.4.5
    @vue/runtime-dom:  3.4.5
    @vue/server-renderer:  3.4.5
    @vue/shared:  3.4.5
    @vue/web-component-wrapper:  1.3.0
    eslint-plugin-vue: ^8.0.3 => 8.7.1
    typescript: ~4.5.5 => 4.5.5
    vue: ^3.2.13 => 3.4.5
    vue-chartjs: ^5.2.0 => 5.3.0
    vue-cli-plugin-electron-builder: ~2.1.1 => 2.1.1
    vue-eslint-parser:  8.3.0
    vue-hot-reload-api:  2.3.4
    vue-loader: ^17.4.2 => 17.4.2 (15.11.1)
    vue-style-loader:  4.1.3
    vue-template-es2015-compiler:  1.9.1
  npmGlobalPackages:
    @vue/cli: Not Found

Steps to reproduce

What is expected?

V-Bind() should work as normal, creating a var and then replacing V-Bind() with var(--created-var)

What is actually happening?

V-Bind() is not creating a CSS variable, resulting in the styling not being applied


----- Before Updating Electron ---- CSS: image In DevTools: image Note: the variable is defined and I can hover to see the value.

---- After Updating Electron ---- image

Downgrading Electron fixes the issue but isn't a valid option