找陈尼克运行不出来的原因

<template>
  <img alt="Vue logo" src="./assets/logo.png" />
  <HelloWorld msg="Hello Vue 3 + Vite" />
</template>

<script setup>
import HelloWorld from './components/HelloWorld.vue'

// This starter template is using Vue 3 experimental <script setup> SFCs
// Check out https://github.com/vuejs/rfcs/blob/script-setup-2/active-rfcs/0000-script-setup.md

export default {
  name: 'App',
  components: {
    HelloWorld
  }
}
</script>


报bug

ivyone@ivyonedeMacBook-Pro vite-project % yarn dev
yarn run v1.22.10
warning package.json: No license field
$ vite
Port 3000 is in use, trying another one...
Port 3001 is in use, trying another one...

  vite v2.0.5 dev server running at:

  > Local:    http://localhost:3002/
  > Network:  http://192.168.3.11:3002/

  ready in 409ms.

[@vue/compiler-sfc] <script setup> is still an experimental proposal.
Follow its status at https://github.com/vuejs/rfcs/pull/227.

[@vue/compiler-sfc] When using experimental features,
it is recommended to pin your vue dependencies to exact versions to avoid breakage.

下午12:51:13 [vite] hmr update /src/App.vue
下午12:51:13 [vite] Internal server error: [@vue/compiler-sfc] <script setup> cannot contain ES module exports. If you are using a previous version of <script setup>, please consult the updated RFC at https://github.com/vuejs/rfcs/pull/227.

/Users/ivyone/hami94/vite-project/src/App.vue
9  |  // This starter template is using Vue 3 experimental <script setup> SFCs
10 |  // Check out https://github.com/vuejs/rfcs/blob/script-setup-2/active-rfcs/0000-script-setup.md
11 |  
   |   ^
12 |  export default {
   |  ^^^^^^^^^^^^^^^^
13 |    name: 'App',
   |  ^^^^^^^^^^^^^^
14 |    components: {
   |  ^^^^^^^^^^^^^^^
15 |      HelloWorld
   |  ^^^^^^^^^^^^^^
16 |    }
   |  ^^^
17 |  }
   |  ^
  Plugin: vite:vue
  File: /Users/ivyone/hami94/vite-project/src/App.vue
      at error (/Users/ivyone/hami94/vite-project/node_modules/@vue/compiler-sfc/dist/compiler-sfc.cjs.js:1354:15)
      at Object.compileScript (/Users/ivyone/hami94/vite-project/node_modules/@vue/compiler-sfc/dist/compiler-sfc.cjs.js:1753:13)
      at resolveScript (/Users/ivyone/hami94/vite-project/node_modules/@vitejs/plugin-vue/dist/index.js:4563:35)
      at genScriptCode (/Users/ivyone/hami94/vite-project/node_modules/@vitejs/plugin-vue/dist/index.js:4793:18)
      at transformMain (/Users/ivyone/hami94/vite-project/node_modules/@vitejs/plugin-vue/dist/index.js:4700:41)
      at TransformContext.transform (/Users/ivyone/hami94/vite-project/node_modules/@vitejs/plugin-vue/dist/index.js:5016:16)
      at Object.transform (/Users/ivyone/hami94/vite-project/node_modules/vite/dist/node/chunks/dep-e0f09032.js:46027:53)
      at async transformRequest (/Users/ivyone/hami94/vite-project/node_modules/vite/dist/node/chunks/dep-e0f09032.js:61631:29)
      at async /Users/ivyone/hami94/vite-project/node_modules/vite/dist/node/chunks/dep-e0f09032.js:61739:32

还原,可以运行,但是运行不出来陈尼克啊

<template>
  <img alt="Vue logo" src="./assets/logo.png" />
  <HelloWorld msg="Hello Vue 3 + Vite" />
</template>

<script setup>
import HelloWorld from './components/HelloWorld.vue'

// This starter template is using Vue 3 experimental <script setup> SFCs
// Check out https://github.com/vuejs/rfcs/blob/script-setup-2/active-rfcs/0000-script-setup.md
</script>

<style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>
上一篇:Vite 解决了 Webpack 哪些问题


下一篇:【C#】关于字典存储不同类型变量的效果