typescript - 使 vue-resource 与打字稿一起工作
问题描述
我似乎对 typescript 设置有疑问,因为它看不到vue-resource
. 我想我设法创建了这个问题的一个小例子,不幸的是我不知道下一步该做什么。
我有:
tsconfig.json
:
{
"compilerOptions": {
"baseUrl": ".",
"outDir": "./built/",
"declaration": true,
"sourceMap": true,
"strict": true,
"noImplicitReturns": true,
"noImplicitAny": true,
"module": "es2015",
"moduleResolution": "node",
"target": "es5",
"allowSyntheticDefaultImports": true,
"experimentalDecorators": true,
"emitDecoratorMetadata": true,
"lib": [ "es2017", "dom" ]
},
"include": [
"./ViewModels/**/*"
],
"exclude": [
"node_modules"
]
}
./ViewModels/vue-shims.d.ts
:
declare module "*.vue" {
import Vue from "vue";
export default Vue;
}
./ViewModels/Home/main.ts
:
import Vue from 'vue';
//const Vue = require('vue');
import VueResource from 'vue-resource'
Vue.use(<any>VueResource);
const v = new Vue(<any>{
el: '#app',
data: {
},
components: {
}
});
//var vm = new Vue();
//console.log(vm.$http);
./ViewModels/Home/Components/ProjectSelection/projectSelectionScripts.ts
:
import Vue from "vue";
import Component from 'vue-class-component';
const NewGroupItemName = "Create new group (drag project here)";
@Component({})
class ProjectSelectionComponent extends Vue {
created() {
this.$http.get("url").then(response => {} => {
});
}
}
export default ProjectSelectionComponent
这是我试图修复的一个巨大项目的一部分。它可能不应该工作,但它应该编译。但它没有:
ViewModels/Home/Components/ProjectSelection/projectSelectionScripts.ts:15:14 - error TS2339: Property '$http' does not exist on type 'ProjectSelectionComponent'.
15 this.$http.get("url").then(response => {
~~~~~
我的.\node_modules
有:
@types\node
,@types\vue-resource
还有很多其他的东西。
package.json
原来的大项目:
{
"version": "1.0.0",
"name": "BigProject",
"private": true,
"scripts": {
"dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot",
"build": "cross-env NODE_ENV=production webpack --progress --hide-modules"
},
"devDependencies": {
"@types/vue-resource": "^0.9.34",
"babel-core": "^6.26.0",
"babel-helper-vue-jsx-merge-props": "^2.0.3",
"babel-loader": "^7.1.2",
"babel-plugin-syntax-jsx": "^6.18.0",
"babel-plugin-transform-vue-jsx": "^3.5.0",
"babel-preset-env": "^1.6.1",
"babel-preset-stage-3": "^6.24.1",
"cross-env": "^5.0.5",
"css-loader": "^0.28.7",
"file-loader": "^1.1.4",
"node-sass": "^4.5.3",
"sass-loader": "^6.0.6",
"style-loader": "^0.19.1",
"ts-loader": "^3.5.0",
"typescript": "^2.9.1",
"url-loader": "^0.6.2",
"vue-loader": "^13.0.5",
"vue-template-compiler": "^2.4.4",
"webpack": "^3.10.0",
"webpack-dev-server": "^2.9.1",
"webpack-notifier": "^1.5.0"
},
"dependencies": {
"@bosket/core": "^0.4.2",
"@bosket/tools": "^0.4.2",
"@bosket/vue": "^0.4.2",
"@types/jspdf": "^1.1.31",
"@types/plotly.js": "^1.35.0",
"bootstrap": "^4.0.0",
"bootstrap-notify": "^3.1.3",
"bootstrap-vue": "^2.0.0-rc.1",
"jquery": "^3.3.1",
"lodash": "^4.17.4",
"moment": "^2.21.0",
"plotly.js": "^1.36.1",
"popper": "^1.0.1",
"popper.js": "^1.12.9",
"vee-validate": "^2.0.4",
"vue": "^2.5.13",
"vue-class-component": "^6.2.0",
"vue-cookie": "^1.1.4",
"vue-cookie-law": "^1.5.0",
"vue-property-decorator": "^6.0.0",
"vue-resource": "^1.3.5",
"vue-router": "^3.0.0",
"vue-spinner": "^1.0.3",
"vuedraggable": "^2.16.0",
"vuelidate": "^0.6.1"
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 8"
]
}
关于这里可能出现什么问题的任何提示?
解决方案
推荐阅读
- cygwin - cygwin:无法访问网络驱动器
- html - 为什么我的容器高度不适合内容?
- sql - SQL通过将表1与表2中的2个条件匹配来选择表列
- visual-studio-code - 更改 VS Code 终端的默认工作目录
- file - 检查文件是否存在 20 小时前的 ansible
- java - 在 Java 中,可以使用“原始未参数化类”-es 而不是使用虚拟接口吗?
- c++ - 将 UTF-8/16 写入文件,codecvt_utf16 被弃用后的替代方法是什么?
- c# - 如何检查一个元素是否存在以不将其复制到 C# 的控件集合中?
- php - 为什么 400030 没有给出大于 400000 的逻辑?
- python - PyCharm 终端无法在 Raspbian 操作系统上运行