vue-source TS2345错误:类型import的参数不可分配

时间:2019-10-12 13:20:36

标签: typescript vue.js vue-resource

尝试在vue项目中导入和使用vue资源时出现打字稿错误。


      TS2345: Argument of type 'typeof import("D:/Projects/Hospitality/content/node_modules/vue-resource/types/vue_resource")' is not assignable to parameter of type 'PluginObject<any> | PluginFunction<any>'.
  Type 'typeof import("D:/Projects/Hospitality/content/node_modules/vue-resource/types/vue_resource")' is not assignable to type 'PluginFunction<any>'.
    Type 'typeof import("D:/Projects/Hospitality/content/node_modules/vue-resource/types/vue_resource")' provides no match for the signature '(Vue: VueConstructor<Vue>, options?: any): void'.

很长时间以来,我一直在寻找答案,我已经厌倦了所有在stackoverflow和github上发现的与此问题有关的解决方案,但是没有一个解决方案对我有用

我的.ts文件:

import Vue from "vue";
import { Mixin } from "vue-mixin-decorator";
import Router from "vue-router";
import BootstrapVue from "bootstrap-vue";
import VueResource from "vue-resource";
import VeeValidate from "vee-validate";

Vue.use(BootstrapVue);
Vue.use(VueResource);
Vue.use(Router);
Vue.use(VeeValidate);

tsconfig文件:

{
  "compilerOptions": {
    "outDir": "./dist/",
    "sourceMap": true,
    "strict": true,
    "noImplicitReturns": true,
    "noImplicitAny": false,
    "module": "es2015",
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true,
    "moduleResolution": "node",
    "target": "es5",
    "lib": [
      "es2015",
      "dom"
    ],
    "types": [
      "webpack-env"
    ]

  },
  "include": [
    "./**/*"
  ]
}

wekpack配置:

/// <binding />
"use strict";

module.exports = (env, options) => {


    const path = require('path');
    const webpack = require('webpack');
    const CleanWebpackPlugin = require('clean-webpack-plugin');

    const MiniCssExtractPlugin = require("mini-css-extract-plugin");
    const VueLoader = require("vue-loader");

    let pathsToClean = ['dist/*.*', 'dist/fonts/*.*', 'dist/images/*.*'];

    let cleanOptions = {
        root: __dirname + '/wwwroot/',
        verbose: true,
        dry: false
    };

    return {
        mode: 'development',
        entry: {
            app: './wwwroot/VueApp/Home/app.ts',
            mainCss: './wwwroot/VueApp/CSS/site.scss'
        },
        devtool: 'source-map',
        plugins: [
            new CleanWebpackPlugin(pathsToClean, cleanOptions),
            new webpack.ProvidePlugin({
                Popper: ['popper.js', 'default'],
                moment: 'moment',
                vueResource: 'vue-resource',
                vueRouter: 'vue-router',
                vuex: 'vuex'
            }),
            new VueLoader.VueLoaderPlugin(),
            new MiniCssExtractPlugin({
                filename: "[name].bundle.css"
            })
        ],
        output: {
            publicPath: "/dist/",
            path: path.join(__dirname, '/wwwroot/dist/'),
            filename: '[name].bundle.js'
        },
        module: {
            rules: [
                {
                    test: /\.js$/,
                    loader: 'babel-loader',
                    exclude: /(node_modules)/,
                    query: {
                        presets: [
                            ['env', { targets: { uglify: true } }]
                        ]
                    }
                },
                {
                    test: /\.tsx?$/,
                    exclude: /node_modules/,
                    loader: "ts-loader",
                    options: {
                        appendTsSuffixTo: [/\.vue$/]
                    }
                },
                {
                    test: /\.(sa|sc|c)ss$/,
                    use: [
                        MiniCssExtractPlugin.loader,
                        { loader: 'css-loader', options: { minimize: true, sourceMap: false } },
                        {
                            loader: 'sass-loader', options: { sourceMap: false } }
                    ],
                },
                {
                    test: /\.(svg|png|jpg|gif)$/, 
                    use: {
                        loader: 'url-loader',
                        options: {
                            limit: 8 * 1024,
                            name: './images/[name].[ext]'
                        }
                    }
                },
                {
                    test: /\.(eot|ttf|woff|woff2)$/,
                    use: {
                        loader: 'url-loader',
                        options: {
                            limit: 8 * 1024,
                            name: './fonts/[name].[ext]'
                        }
                    }
                },
                {
                    test: /\.vue$/,
                    loader: 'vue-loader'
                }
            ]
        },
        resolve: {
            alias: {
                vue: 'vue/dist/vue.js'
            },
            extensions: ['.ts', '.js', '.vue', '.json']
        }
    };
};

我的vue资源是1.3.5版和打字稿版本3.1.1

0 个答案:

没有答案