在Vue 3中，<script setup> 和普通的 <script> 标签都用于包含组件的JavaScript逻辑，但它们有一些关键区别。

<script setup>

1. Simpler Syntax: <script setup> 使用更简单、更精炼的语法，专门用于 Composition API。
2. Optimized: 因为它专为 Composition API 设计，所以它更加优化。
3. Implicit Return: 在 <script setup> 内定义的 ref 和 reactive 会自动暴露给模板，不需要特别声明。
4. defineProps 和 defineEmits: 使用特殊的函数来定义 props 和 emits，而不是 props 和 emits 选项。

<script setup>
import { ref } from 'vue'

const count = ref(0)
</script>

<script>

1. Options API: 用于 Vue 2 的 Options API。
2. Explicit Return: 使用 return 在 setup 函数中明确返回要暴露给模板的属性。
3. Verbose: 相对于 <script setup>，需要编写更多的代码。

<script>
import { ref } from 'vue'

export default {
  setup() {
    const count = ref(0)
    return {
      count
    }
  }
}
</script>

结合使用

在一些特殊情况下，你可能需要同时使用 <script setup> 和普通的 <script>。这主要用于类型定义或一些不能通过 <script setup> 完成的复杂操作。

<script setup>
import { ref } from 'vue'

const count = ref(0)
</script>

<script>
// 用于类型定义或其它逻辑
</script>

请注意，一个组件不能同时拥有两个相同类型的 <script> 标签，但 <script setup> 和普通的 <script> 可以共存。

以上就是两者的主要区别和用法。根据你的具体需要，你可以选择其中一个或同时使用两者。