vue: 使用ts-loader引入ts文件

安装

npm install typescript ts-loader --save-dev

  

 

  
1
 

vue.config.js

configureWebpack: {
  resolve: {extensions: [".ts", ".tsx", ".js", ".json"]},
  module: { rules: [ { test: /\.ts$/, loader: "ts-loader" }, ]
  }
}

  

 

  
1
  
2
  
3
  
4
  
5
  
6
  
7
  
8
 

tsconfig.json

{
  "compilerOptions": { "target": "es5", "module": "commonjs", "noImplicitAny": true, "removeComments": true, "preserveConstEnums": true, "sourceMap": false
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules","**/*.spec.ts"]
}

  

 

  
1
  
2
  
3
  
4
  
5
  
6
  
7
  
8
  
9
  
10
  
11
  
12
 

报错

Syntax Error: TypeError: loaderContext.getOptions is not a function

  

 

  
1
 

原因：

ts-loader 9 不支持 webpack 4

  

 

  
1
 

换一个版本

npm install ts-loader@8.2.0

  

 

  
1
 

参考：
https://github.com/TypeStrong/ts-loader/issues/595

文章来源: pengshiyu.blog.csdn.net，作者：彭世瑜，版权归原作者所有，如需转载，请联系作者。

原文链接：pengshiyu.blog.csdn.net/article/details/116653235