visual studio - Não foi possível encontrar um arquivo de declaração para o módulo 'material-ui/styles/MuiThemeProvider'?
Estou tentando usar o tema react material-ui após tê-lo instalado pelo npm, e recebo os seguintes erros quando incluo 'import MuiThemeProvider from "material-ui/styles/MuiThemeProvider";' em boot-client.tsx:
TS7016: Não foi possível encontrar um arquivo de declaração para o módulo 'material-ui/styles/MuiThemeProvider'. 'W:/web/WebFront/node_modules/material-ui/styles/MuiThemeProvider.js' implicitamente possui um tipo 'any'. Tente
npm install @types/material-ui/styles/MuiThemeProviderse ele existir ou adicione um novo arquivo de declaração (.d.ts) contendodeclare module 'material-ui/styles/MuiThemeProvider';
Eu tentei ambas as sugestões sem sucesso, incluindo executar o comando: npm install -D @types/material-ui.
Minha pasta @types em node_modules existe com os tipos relevantes.
Aqui está o código onde estou tentando usá-lo:
import './css/site.css';
import 'bootstrap';
import * as React from 'react';
import * as ReactDOM from 'react-dom';
import { AppContainer } from 'react-hot-loader';
import { Provider } from 'react-redux';
import { ConnectedRouter } from 'react-router-redux';
import { createBrowserHistory } from 'history';
import configureStore from './configureStore';
import { ApplicationState } from './store';
import * as RoutesModule from './routes';
let routes = RoutesModule.routes;
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
// Create browser history to use in the Redux store
const baseUrl = document.getElementsByTagName('base')[0].getAttribute('href')!;
const history = createBrowserHistory({ basename: baseUrl });
// Get the application-wide store instance, prepopulating with state from the server where available.
const initialState = (window as any).initialReduxState as ApplicationState;
const store = configureStore(history, initialState);
function renderApp() {
// This code starts up the React app when it runs in a browser. It sets up the routing configuration
// and injects the app into a DOM element.
ReactDOM.render(
, document.getElementById('react-app') ); }
renderApp();
// Allow Hot Module Replacement
if (module.hot) {
module.hot.accept('./routes', () => {
routes = require<typeof RoutesModule>('./routes').routes;
renderApp();
});
}
Resposta #1
Ok, eu descobri, no tsconfig.json em 'compilerOptions' o Visual Studio por padrão tinha seus tipos definidos como ["webpack-env"], eu precisava adicionar "material-ui" a ele ou, opcionalmente, apenas removê-lo: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html
Resposta #2
A solução que funcionou para mim é a resposta do med acima, que eu explico com mais detalhes abaixo.
Abra o arquivo tsconfig.json. Adicione "types":"material-ui", dentro de "compilerOptions": {}
como em
"compilerOptions": {"types":"material-ui"}