Rollup-plugin-typescript2: Erreur : jeton inattendu (importation axios)

Créé le 19 mars 2018 · 8Commentaires · Source: ezolenko/rollup-plugin-typescript2

[!] Error: Unexpected token
node_modules\axios\package.json (2:9)
1: {
2:   "_from": "axios",
            ^

Même erreur que lors de l'importation d'axios dans un projet ES6 pur et de ne pas avoir défini le navigateur = true pour rollup-plugin-node-resolve. Cas de test simple : fichier js unique contenant

import axios from "axios";
window.process = window.process || { env: {} };
axios.get("http://httpbin.org/").then(response => console.log("Got length: " + response.data.length));

L'utilisation de rollup.config.js ci-dessous produit l'erreur, mais en excluant rollup-plugin-typescript2, cela fonctionne.

Versions

nœud : 8.9.4
tapuscrit: 2.7.2
cumul : 0,57,1
rollup-plugin-typescript2 : 0.12.0

rollup.config.js

import typescript from 'rollup-plugin-typescript2';
import resolve from 'rollup-plugin-node-resolve';
import commonjs from 'rollup-plugin-commonjs';

export default {
    input: 'src/main.js',
    output: {
        file: 'public/bundle.js',
        format: 'iife',
        sourcemap: true
    },
    plugins: [
        typescript(),
        resolve({ browser: true }),
        commonjs()
    ]
};

Source

JWMB

Commentaire le plus utile

En regardant votre référentiel de test, le plugin produit la même sortie que tsc. Vous pouvez le vérifier dans le fichier .rpt2_cache/xxx/code/xxx -- recherchez la propriété code de json à l'intérieur. C'est ce qui est transmis au rollup.

La principale différence entre les résultats 2 est lorsque import axios from 'axios'; fait -- dans le cas de simples js rollup saisit axios/dist/axios.js -- build webpaked. En cas d'utilisation du plugin, axios/lib/axios.js est résolu.

La version Webpacked est apparemment la version du navigateur trouvée par magie par rollup-plugin-node-resolve en mode navigateur.

Si vous mettez le plug-in dactylographié en dernier dans la chaîne, le rollup utilise la résolution de nœud pour résoudre les importations par lui-même, et tout fonctionne comme prévu.

Cette ligne dans votre dépôt de test :
tsPluginConf.plugins.splice(tsPluginConf.plugins.length - 1, 0, typescript());

C'est la première fois que je vois l'ordre des plugins vraiment important :). Je mettrai à jour le fichier readme.

ezolenko le 4 avr. 2018

👍2

Tous les 8 commentaires

Pourriez-vous essayer la suggestion faite ici : https://github.com/rollup/rollup-plugin-commonjs/issues/28 (en utilisant rollup-plugin-json)

ezolenko le 20 mars 2018

Merci, cela semble fonctionner (ajout de rollup-plugin-json en tant que plugin) !

La sortie est cependant très différente de la remontée du fichier .js correspondant, la signature iife devenant

var SomeName = (function (exports,tty,util,url,http,https,assert,stream,zlib)...

Je m'attendais à ce que rollup-plugin-typescript2 exécute essentiellement tsc avec mon tsconfig.config comme étape de pré-rollup, mais quand je fais cela (tsc d'abord, puis rollup sans le plugin dactylographié), j'obtiens

var SomeName = (function (exports)...

Il me manque probablement un paramètre de configuration ici ..?

JWMB le 21 mars 2018

Ces autres paramètres sont-ils utilisés dans la fonction ? Le corps est-il le même dans les deux cas ?

ezolenko le 21 mars 2018

Oui, ils sont utilisés, et il y a un gros morceau supplémentaire, en commençant par

 function createCommonjsModule(fn, module) {

au milieu du corps (lors de l'utilisation du plugin dactylographié par rapport à l'utilisation de plain js comme source). Cela semble en grande partie lié à la fonctionnalité de débogage des nœuds.
J'ai mis en place un référentiel de cas de test minimal ici .

JWMB le 22 mars 2018

La version Webpacked est apparemment la version du navigateur trouvée par magie par rollup-plugin-node-resolve en mode navigateur.

Si vous mettez le plug-in dactylographié en dernier dans la chaîne, le rollup utilise la résolution de nœud pour résoudre les importations par lui-même, et tout fonctionne comme prévu.

Cette ligne dans votre dépôt de test :
tsPluginConf.plugins.splice(tsPluginConf.plugins.length - 1, 0, typescript());

C'est la première fois que je vois l'ordre des plugins vraiment important :). Je mettrai à jour le fichier readme.

ezolenko le 4 avr. 2018

👍2

Vous n'avez probablement pas besoin du plugin json maintenant non plus.

ezolenko le 4 avr. 2018

@ezolenko j'ai été vraiment déconcerté par le readme 😬

Ça dit:

Must be before this plugin in the plugin list, especially when browser: true option is used, see #66

Je pense que je pensais où mettre le plugin dactylographié, puis j'ai lu la ligne suivante et j'ai pensé que this plugin faisait référence à rollup-plugin-node-resolve .

Super boulot quand même ! Merci