jss-vendor-prefixer replaces animation: ['$spinner rotation'] on server but not client (has repro repository)

As mentioned in #1334

Expected behavior: I have these styles. I don't know if arrays in animation are supported, but I expect it to either work on both the client and server, or fail on both the client server.

const styles = {
  '@keyframes spinner-rotation': {
    from: {transform: 'rotate(0deg)'},
    to: {transform: 'rotate(360deg)'},
  },
  spinner: {
    animation: [
      '$spinner-rotation linear infinite 1s',
    ],
  },
}

Describe the bug: On the server it converts the animation name:

animation: keyframes-spinner-rotation-0-2-1 linear infinite 1s;

On the client it doesn't:

animation: $spinner-rotation linear infinite 1s;

Codesandbox link: Can't use code sandbox because I have to demonstrate output on the server side. I made a repo to demonstrate: https://github.com/jedwards1211/jss-plugin-vendor-prefixer-issue Just run

git clone https://github.com/jedwards1211/jss-plugin-vendor-prefixer-issue
cd jss-plugin-vendor-prefixer-issue
npm i
npm start

Versions (please complete the following information):

• jss: 10.1.1
• Browser [e.g. chrome, safari]: Chrome 80.0.3987.163
• OS [e.g. Windows, macOS]: macOS 10.15.3