Describe the bug

Vite config define: {APP_DOMAIN: JSON.strinfigy('x')}
and vue component source

data(){
        return {
                APP_DOMAIN
        }
},

works fine in dev mode, but on build returns error on APP_DOMAIN position

[rollup-plugin-dynamic-import-variables] Unexpected token (166:6)
App.vue:166:6
error during build:
SyntaxError: Unexpected token (166:6)

Tried also APP_DOMAIN: APP_DOMAIN which works as expected in dev mode, but build translate it to x: 'x'
Webpack didn't have issue with this.

Reproduction

link

System Info

System:
    OS: macOS 12.1
    CPU: (8) x64 Intel(R) Core(TM) i7-6700HQ CPU @ 2.60GHz
    Memory: 403.77 MB / 16.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 14.18.2 - /usr/local/opt/node@14/bin/node
    npm: 6.14.15 - /usr/local/opt/node@14/bin/npm
  Browsers:
    Chrome: 97.0.4692.99
    Firefox: 95.0.2
    Safari: 15.2
  npmPackages:
    @vitejs/plugin-legacy: ^1.6.4 => 1.6.4 
    @vitejs/plugin-vue: ^2.1.0 => 2.1.0 
    vite: ^2.7.13 => 2.7.13

Used Package Manager

npm

Logs

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/vue-next instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.