首页 > 解决方案 > 使用 lang=ts 和 lang=js 的基于类的组件

问题描述

我有一个使用基于类的组件的 vue 项目。我想要一个使用 js 语言而不是 typescript 的组件。

Vue 抱怨我需要一个新的加载器,但我不知道如何添加它。

我正在使用 vue-cli,我没有 webpack.config.js 但我有一个标准的 vue.config.js

使用 vue-cli inspect --plugins,我有以下插件,包括 vue-loader

[
  'vue-loader',
  'define',
  'case-sensitive-paths',
  'friendly-errors',
  'html',
  'pwa',
  'preload',
  'prefetch',
  'copy',
  'fork-ts-checker'
]

然而 vue 在组件中抱怨没有<script lang="ts">

Module parse failed: Unexpected character '@' (6:0)
File was processed with these loaders:
 * ./node_modules/cache-loader/dist/cjs.js
 * ./node_modules/vue-loader/lib/index.js
You may need an additional loader to handle the result of these loaders.
| import Component from 'vue-class-component';
| 
> @Component
| export default class TreeNavigation extends Vue {

基本上,我想<script lang="ts">与常规组件一起使用<script><script> or <script lang="js">

标签: javascriptvue.jswebpackvuejs2

解决方案


我需要添加 babel 插件(加载器)vue add babel


推荐阅读