javascript - unexpected - you may need an appropriate loader to handle this file type. css

webpack+babel-reaccionar, token inesperado ''import''

Question

Estoy tratando de hacer que index.js funcione con es2015.

Antes de dirigirme a .babelrc , tenga en cuenta que he agregado AMBOS es2015 y reaccionar (para estar seguro, pero no hay reacción aquí).

Cuenta con

import { default as Logary, Targets, getLogger, build } from ''logary'';

Y aquí está .babelrc:

{
  "presets": [''es2015'', ''react'']
}

Y webpack.config.js

var webpack = require(''webpack''),
    HtmlWebpackPlugin = require(''html-webpack-plugin''),
    path = require(''path'');

module.exports = {
  devtool: ''source-map'',
  entry: [
    ''webpack-hot-middleware/client?reload=true'',
    ''./index.js''
  ],
  output: {
    path: path.resolve(''./dist''),
    filename: ''[name].js'',
    publicPath: ''/''
  },
  loaders: [
    { test: //.js$/,
      loader: ''babel-loader'',
      exclude: /node_modules/
    },
    { test: //.css$/, loader: "style!css" },
    { test: //.(png|jpg|jpeg|gif|woff)$/, loader: ''url?limit=8192'' },
    { test: //.(otf|eot|ttf)$/, loader: "file?prefix=font/" },
    { test: //.svg$/, loader: "file" }
  ],
  plugins: [
    new HtmlWebpackPlugin({
      filename: ''index.html'',
      template: ''index.template.html''
    }),
    new webpack.optimize.OccurenceOrderPlugin(),
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NoErrorsPlugin(),
    new webpack.DefinePlugin({
      ''process.env.NODE_ENV'': JSON.stringify(''development'')
    })
  ],
  resolve: {
    extensions: ['''', ''.js'']
  }
}

Da error:

ERROR in ./index.js
Module parse failed: /Users/h/logary-js/examples/webpack/index.js Line 1: Unexpected token
You may need an appropriate loader to handle this file type.
| import { default as Logary, Targets, getLogger, build } from ''logary'';
|
| // once per site/app

¿Por qué no está manejando el token de importación?

Answer 1

Su estructura webpack.config.js no es correcta. Webpack no reconoce todos tus cargadores. Específicamente, debe colocar la propiedad de los cargadores dentro de una sección de módulo como esta:

module: {
   loaders: [
    { test: //.js$/,
      loader: ''babel-loader'',
      exclude: /node_modules/
    },
    { test: //.css$/, loader: "style!css" },
    { test: //.(png|jpg|jpeg|gif|woff)$/, loader: ''url?limit=8192'' },
    { test: //.(otf|eot|ttf)$/, loader: "file?prefix=font/" },
    { test: //.svg$/, loader: "file" }
  ],
}