Chartjs-How to draw a line in chartjs Scatter graph with vuejs?

You misplaced the inline plugin object. It should not be under options, but at the top level of the object used to construct the chart.

A possible way to specify the plugin, in your setting, may be to declare a computed method chartPlugins:

computed: {
    chartData(){
        return {
            datasets: this.datasets,
        };
    },
    chartPlugins(){
        return [{
            id: "horizontalMedianLine",
            
            beforeDraw(chart){
                //......
            }
        }]
    }
}

and use it in the template:

<template>
  <Scatter
    :style="{ height: '400px' }"
    :plugins="chartPlugins"
    :data="chartData"
    :options="chartOptions"
  />
</template>

Also, you don’t need a plugin to draw those lines; it would be more effective to do that with two new datasets. Here’s the horizontal one:

methods: {
    setDataSets(){
        this.datasets = [];
        chartConfig.playerStats.forEach((player) => {
            //.......
        });
        const attack = this.playerStats.map(({attack}) => attack);
        this.datasets.push({
            borderColor: 'red',
            showLine: true,
            pointRadius: 0,
            segment: {borderDash: [5, 5]},
            data: [[Math.min(...attack), 1.25], [Math.max(...attack), 1.25]]
        });
    }
}