Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
5
respostas

Importar arquivo .js

Referente ao curso React parte 1: componentes reutilizáveis para sua webapp

por Rafael Devitte
| 64k xp | 9 posts

Bom dia, estou com a mesma dúvida postada por outro usuário. Ao tentar importar o ui.js utilizado pelo side-menu do Pure CSS me é apresentado um erro.

Se eu tentar importar o script para a minha aplicação me é apresentado o erro "TypeError: document is undefined" e aponta dentro do script onde é chamado o document .

Consegui fazer o script funcionar adicionando ao 'App.js' o seguinte código:

componentWillMount() {
    const script = document.createElement("script");

    script.src = "https://purecss.io/js/ui.js";
    script.async = true;

    document.body.appendChild(script);
  }

Porém gostaria de importar este script para o meu projeto, na pasta "/src/js" por exemplo, afim de não ficar dependendo de terceiros.

O que gostaria de saber é como faço pra importar este tipo de script para minha aplicação, se possível passar os passos que devem ser realizados.

5 respostas
por Hugo José da Silva Sousa
| 310.3k xp | 120 posts

Fala Rafael blz?

Cara pelo que eu entendi na minha postagem não é possível importar um file .js pois o a arquitetura é pré-compilado. Mas ainda estou pesquisando pois não faz sentido não permitir importar um file .js.

por Hugo José da Silva Sousa
| 310.3k xp | 120 posts

Fala Rafael blz?

Cara pelo que eu entendi na minha postagem não é possível importar um file .js pois o a arquitetura é pré-compilado. Mas ainda estou pesquisando pois não faz sentido não permitir importar um file .js.

Dá até para entender o motivo quando se fala no webpack pois nesse caso ele disponibiliza os códigos pré-compilados como módulos.

por Hugo José da Silva Sousa
| 310.3k xp | 120 posts

Rafael, desculpa a resposta duplicada.

Eu achei isso, vou testar quando chegar à casa. Tenta aí vê se vai! https://cursos.alura.com.br/forum/topico-react-importando-arquivo-js-ja-existente-36576

por Rafael Devitte
| 64k xp | 9 posts

Olá Hugo, desculpe a demora.

Fazendo deste modo funcionou, mas imaginei que tivesse algum outro modo melhor pra se fazer, sem precisar ter de adicionar todos os Scripts todos no Index.

Obrigado pelo auxílio.

solução!
por Rafael Devitte
| 64k xp | 9 posts

Olá Hugo, consegui fazer o que eu queria, acredito que ficou melhor.

Na pasta "public" do projeto criei uma pasta "static/js/" e dentro dela coloquei o arquivo "ui.js". Depois no arquivo "App.js" adicionei o seguinte código:

componentDidMount() {
    const script = document.createElement("script");
    script.src = "./static/js/ui.js";
    script.async = true;
    script.document = document;
    document.body.appendChild(script);
  }

O código é bem parecido com o código que utilizei inicialmente, apenas tive de definir o "document " que o JS iria utilizar, e fiz isso com a linha "script.document = document;".

Deste modo consegui deixar as coisas como eu queria e tudo funcionou corretamente. Espero que lhe auxilie também.