У меня новая проблема. Я пытаюсь использовать дизайн материалов (materiel.io) с Typescript и Webpack. Сначала я установил материал с npm. Затем в одном из моих классов я импортирую @ material / base.
'use strict';
import {MDCComponent} from '@material/base';
export default class Component {
MDCComponent: MDCComponent;
constructor() {
this.MDCComponent = undefined;
}
}
В моем редакторе уже есть следующее сообщение:
Не удается найти модуль '@material /base'.ts(2307)
Для информации я использую визуальный редактор кода студии с eslint. Вот мой файл конфигурации eslintr c. json:
{
"parser": "@typescript-eslint/parser",
"parserOptions": {
"ecmaVersion": 2017,
"sourceType": "module" }, "env": {
"es6": true,
"browser": true,
"amd": true,
"node": true,
"jest": true }, "globals": {}, "extends": ["eslint:recommended"], "rules": {
"array-bracket-spacing": ["error", "never", {}],
"brace-style": "error",
"camelcase": ["error", { "properties": "never" }],
"comma-dangle": [
"error",
{
"arrays": "never",
"objects": "never",
"imports": "never",
"exports": "never",
"functions": "never"
}
],
"comma-spacing": ["error", { "before": false, "after": true }],
"comma-style": ["error", "last"],
"complexity": ["warn", 7],
"computed-property-spacing": ["error", "never"],
"curly": ["error", "all"],
"dot-notation": ["error", { "allowPattern": "^[a-z]+(_[a-z]+)+$" }],
"eol-last": "error",
"eqeqeq": ["error", "always"],
"for-direction": "off",
"func-call-spacing": ["error", "never"],
"indent": [
"error",
2,
{
"ArrayExpression": "first",
"CallExpression": { "arguments": "first" },
"flatTernaryExpressions": false,
"MemberExpression": 1,
"ObjectExpression": "first",
"outerIIFEBody": 0,
"SwitchCase": 1,
"VariableDeclarator": { "var": 2, "let": 2, "const": 3 }
}
],
"key-spacing": ["error", { "beforeColon": false, "afterColon": true }],
"keyword-spacing": ["error"],
"linebreak-style": ["error", "unix"],
"max-depth": ["error", 3],
"multiline-comment-style": ["error", "starred-block"],
"no-caller": "error",
"no-cond-assign": ["error", "except-parens"],
"no-console": ["error", { "allow": ["warn", "error"] }],
"no-empty": "error",
"no-loop-func": "error",
"no-mixed-spaces-and-tabs": "error",
"no-multiple-empty-lines": ["error", { "max": 1 }],
"no-multi-str": "error",
"no-new": "error",
"no-self-assign": ["error", { "props": false }],
"no-sequences": "error",
"no-trailing-spaces": "error",
"no-undef": "error",
"no-unreachable": "error",
"no-unsafe-negation": "error",
"no-unused-expressions": ["error", { "allowShortCircuit": true }],
//"no-unused-vars": "error",
"no-unused-vars": "warn",
"no-with": "error",
"object-curly-spacing": ["error", "always"],
"one-var": [
"error",
{ "var": "always", "let": "consecutive", "const": "never" }
],
"one-var-declaration-per-line": ["error", "initializations"],
"operator-linebreak": ["error", "after"],
"quotes": ["error", "single"],
"semi": ["error", "always"],
"semi-spacing": ["error", { "before": false, "after": true }],
"semi-style": ["error", "last"],
"space-before-blocks": ["error", "always"],
"space-before-function-paren": ["error", "never"],
"space-in-parens": ["error", "never"],
"space-infix-ops": "error",
"space-unary-ops": ["error", { "words": true, "nonwords": false }],
"wrap-iife": ["error", "inside", { "functionPrototypeMethods": true }] } }
и tsconfig. json:
{
"compilerOptions": {
"outDir": "./dist/",
"noImplicitAny": true,
"module": "es6",
"target": "es5",
"jsx": "react",
"allowJs": true
}
}
Затем при компиляции моего файла я получаю следующую ошибку сообщение:
TS2314: Generi c тип 'MDCComponent' требует 1 аргумента (ов) типа.
Мой пакет. json:
{
"name": "project",
"version": "1.0.0",
"description": "My project",
"main": "index.js",
"scripts": {
"dev": "./node_modules/.bin/cross-env NODE_ENV=dev ./node_modules/.bin/webpack",
"prod": "./node_modules/.bin/webpack",
"hotdev": "./node_modules/.bin/cross-env NODE_ENV=dev ./node_modules/.bin/webpack-dev-server -d --hot --config webpack.config.js --watch",
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"@babel/core": "^7.9.0",
"@babel/plugin-transform-runtime": "^7.9.0",
"@babel/preset-env": "^7.9.0",
"@babel/runtime": "^7.9.2",
"autoprefixer": "^9.7.5",
"babel-eslint": "^10.1.0",
"babel-loader": "^8.1.0",
"cross-env": "^7.0.2",
"css-loader": "^3.4.2",
"eslint": "^6.8.0",
"extract-loader": "^5.0.1",
"file-loader": "^6.0.0",
"handlebars": "^4.7.3",
"handlebars-loader": "^1.7.1",
"html-loader": "^1.0.0",
"material-components-web": "^5.1.0",
"material-design-icons": "^3.0.1",
"node-sass": "^4.13.1",
"npm-check-updates": "^4.0.5",
"postcss-loader": "^3.0.0",
"sass": "^1.26.3",
"sass-loader": "^8.0.2",
"style-loader": "^1.1.3",
"svg-inline-loader": "^0.8.2",
"ts-loader": "^6.2.2",
"typescript": "^3.8.3",
"uglifyjs-webpack-plugin": "^2.2.0",
"webpack": "^4.42.1",
"webpack-cli": "^3.3.11",
"webpack-dev-server": "^3.10.3"
}
}
Что мне делать?
Большое вам спасибо.