我試圖讓這個標題組件被識別,但它不是。我試過將 eslint 設定為嚴格,并弄亂我的語法無濟于事。我不明白,這應該很簡單。任何幫助,將不勝感激。
應用程式
<template>
<div class="container">
<header />
</div>
</template>
<script>
import header from './components/header'
export default {
name: 'App',
components: {
header,
}
}
</script>
<style>
</style>
主檔案
import { createApp } from 'vue'
import App from './App.vue'
createApp(App).mount('#app')
索引.html
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= htmlWebpackPlugin.options.title %></title>
</head>
<body>
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app">
</div>
<!-- built files will be auto injected -->
</body>
</html>
標題.vue
<template>
<header>
<h1>Component header</h1>
</header>
</template>
<script>
export default {
name: 'header',
};
</script>
<style>
header {
display: flex;
}
</style>
任何幫助都是極好的。謝謝你。
uj5u.com熱心網友回復:
在main.js需要被匯入到index.html:
<body>
<div id="app"></div>
<script type="module" src="/src/js/main.js"></script>
</body>
(使用正確的路徑)
最好將您的標題組件重命名為另一個詞,因為<header>在html
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/367441.html
上一篇:匯入img而不是SVG
