javascript - page - Webpack getting started, error de importación
webpack-- w (1)
Como se ha sugerido, deberá configurar Babel para que funcione.
Instalar dependencias Babel:
npm install --save-dev babel-loader babel-core babel-preset-react babel-preset-es2015
Deberá editar su archivo webpack.config.js para incluir la configuración del cargador babel:
var webpack = require(''webpack'');
module.exports = {
...
module: {
loaders: [
{
test: /.jsx?$/,
loader: ''babel-loader'',
exclude: /node_modules/,
query: {
presets: [''es2015'', ''react'']
}
}
]
},
};
Estoy comenzando con Webpack, pero ya encontré el siguiente problema: Creé un archivo app / index.js (como se especifica en la documentación). También creé un archivo index.html (copié el HTML y CSS de la documentación). Ejecuté los comandos correctos en la CLI (incluida la generación de un archivo dist / bundle.js).
El código:
<!DOCTYPE html>
<html lang="nl">
<head>
<meta charset="UTF-8">
<title>Webpack</title>
<!-- <script src="https://unpkg.com/[email protected]" type="text/javascript"></script> -->
<script src="dist/bundle.js" type="text/javascript"></script>
</head>
<body>
<!-- Markup here -->
<div id="root"></div>
<!-- <script src="app/index.js" type="text/javascript"></script> -->
</body>
</html>
El JS:
// To bundle the lodash dependency with the index.js, we need to import lodash.
import _ from ''lodash'';
function component () {
var element = document.createElement( ''div'' );
/* lodash is required for the next line to work */
element.innerHTML = _.map( [ ''Hello, webpack'' ], function( item ) {
return item + '' '';
});
return element;
}
document.body.appendChild( component() );
Esto devuelve el siguiente error de consola: bundle.js:48 Uncaught SyntaxError: Unexpected token import
¿Cómo hago para que esto se ejecute correctamente?