-
Notifications
You must be signed in to change notification settings - Fork 2
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
TypeScriptの導入 #76
Comments
WebpackerでVue3までの動作確認はできている状態でTypeScriptを導入しようとしているんですが、コンパイルエラーになってしまっており、この原因が解決できませんでした。 ERROR in ./app/javascript/src/components/HelloWorld.vue?vue&type=template&id=6e980648&scoped=true&ts=true (./node_modules/vue-loader/dist/templateLoader.js??ref--5!./node_modules/vue-loader/dist??ref--15-0!./app/javascript/src/components/HelloWorld.vue?vue&type=template&id=6e980648&scoped=true&ts=true) 3:27
Module parse failed: Unexpected token (3:27)
File was processed with these loaders:
* ./node_modules/vue-loader/dist/templateLoader.js
* ./node_modules/vue-loader/dist/index.js
You may need an additional loader to handle the result of these loaders.
| import { toDisplayString as _toDisplayString, openBlock as _openBlock, createElementBlock as _createElementBlock } from "vue"
|
> export function render(_ctx: any,_cache: any,$props: any,$setup: any,$data: any,$options: any) {
| return (_openBlock(), _createElementBlock("p", null, _toDisplayString(_ctx.message), 1 /* TEXT */))
| }
ℹ 「wdm」: Failed to compile. Vueのソースは下記の通りで、状況は次の通り。
<template>
<p>
{{ message }}
</p>
</template>
<script lang="ts">
import { ref, defineComponent } from 'vue'
export default defineComponent({
name: 'HelloWorld',
setup() {
const message = ref('Hello World')
return {
message
}
}
})
</script>
<style scoped>
p {
font-size: 2em;
text-align: center;
}
</style> やったこと列挙1. WebpackerデフォルトのTypeScriptインストール
2. ts-loaderを使用
3. 2.に加えて、TypeScript系のESLintを導入する
|
TypeScriptはあとからでも導入できるので、対処は一旦保留にする。 |
サブタスク
rails webpacker:install:typescript
メモ
The text was updated successfully, but these errors were encountered: