Rollup-plugin-typescript2: Error: token inesperado (importación de axios)

Creado en 19 mar. 2018  ·  8Comentarios  ·  Fuente: ezolenko/rollup-plugin-typescript2

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

El mismo error que al importar axios en un proyecto ES6 puro y no haber configurado browser = true para rollup-plugin-node-resolve. Caso de prueba simple: archivo js único que contiene

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

El uso de rollup.config.js siguiente produce el error, pero al excluir rollup-plugin-typescript2 funciona.

Versiones

  • nodo: 8.9.4
  • mecanografiado: 2.7.2
  • resumen: 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()
    ]
};

Comentario más útil

Mirando su repositorio de prueba, el complemento produce la misma salida que tsc. Puede verificarlo en .rpt2_cache/xxx/code/xxx file - busque la propiedad code de json dentro. Eso es lo que se pasa al resumen.

La principal diferencia en 2 resultados es cuando import axios from 'axios'; hace - en los casos de simple js rollup agarra axios/dist/axios.js - compilación webpaked. En caso de utilizar el complemento axios/lib/axios.js se resuelve.

La compilación empaquetada en la web es aparentemente la versión del navegador que rollup-plugin-node-resolve encuentra mágicamente en modo navegador.

Si coloca el complemento de mecanografiado al final de la cadena, el resumen utiliza la resolución de nodos para resolver las importaciones por sí mismo, y todo funciona como se esperaba.

Esta línea en su repositorio de prueba:
tsPluginConf.plugins.splice(tsPluginConf.plugins.length - 1, 0, typescript());

Esta es la primera vez que veo que el orden de los complementos realmente importa :). Actualizaré el archivo Léame.

Todos 8 comentarios

¿Podría probar la sugerencia hecha aquí: https://github.com/rollup/rollup-plugin-commonjs/issues/28 (usando rollup-plugin-json)

Gracias, parece funcionar (agregando rollup-plugin-json como complemento).

Sin embargo, el resultado es muy diferente de acumular el archivo .js correspondiente, y la firma iife se convierte en

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

Esperaba que rollup-plugin-typescript2 básicamente ejecutara tsc con mi tsconfig.config como un paso previo al rollup, pero cuando hago eso (primero tsc, luego rollup sin el plugin de mecanografiado) obtengo

var SomeName = (function (exports)...

Probablemente me falte alguna configuración de configuración aquí ..?

¿Se utilizan esos otros parámetros dentro de la función? ¿El cuerpo es el mismo en ambos casos?

Sí, se usan y hay una gran parte adicional, comenzando con

 function createCommonjsModule(fn, module) {

en el medio del cuerpo (cuando se usa el complemento mecanografiado en comparación con el uso de js simple como fuente). Mucho parece estar relacionado con la funcionalidad de depuración de Node.
He puesto un repositorio de casos de prueba mínimo aquí .

Mirando su repositorio de prueba, el complemento produce la misma salida que tsc. Puede verificarlo en .rpt2_cache/xxx/code/xxx file - busque la propiedad code de json dentro. Eso es lo que se pasa al resumen.

La principal diferencia en 2 resultados es cuando import axios from 'axios'; hace - en los casos de simple js rollup agarra axios/dist/axios.js - compilación webpaked. En caso de utilizar el complemento axios/lib/axios.js se resuelve.

La compilación empaquetada en la web es aparentemente la versión del navegador que rollup-plugin-node-resolve encuentra mágicamente en modo navegador.

Si coloca el complemento de mecanografiado al final de la cadena, el resumen utiliza la resolución de nodos para resolver las importaciones por sí mismo, y todo funciona como se esperaba.

Esta línea en su repositorio de prueba:
tsPluginConf.plugins.splice(tsPluginConf.plugins.length - 1, 0, typescript());

Esta es la primera vez que veo que el orden de los complementos realmente importa :). Actualizaré el archivo Léame.

Probablemente tampoco necesite el complemento json ahora.

@ezolenko Me

Dice:

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

Creo que estaba pensando dónde pongo el complemento mecanografiado, y luego leí la siguiente línea y pensé que this plugin se refería a rollup-plugin-node-resolve .

¡Buen trabajo! Gracias

Arreglado, gracias :)

¿Fue útil esta página
0 / 5 - 0 calificaciones