Webpack + angular2

这个错误的含义是什么？在捆绑angular2应用程序与webpack
“Uncaught SyntaxError：Unexpected token <”in bundel.js 1.Webpack + angular2

这是什么我失踪。我已经添加了所有必要的装载机。

// webpack.config.js 
'use strict'; 

var path = require('path'); 
var autoprefixer = require('autoprefixer'); 
var webpack = require('webpack'); 
var ExtractTextPlugin = require('extract-text-webpack-plugin'); 

//const TARGET = process.env.npm_lifecycle_event; 

module.exports = { 
    //context: __dirname + '/public', 
    entry: './public/components/boot/boot.ts', 
    output: { 
    path: path.resolve('dist/'), // This is where images AND js will go 
    publicPath: 'public/', // This is used to generate URLs to e.g. images 
    filename: 'bundle.js' 
    }, 
    plugins: [ 
    new ExtractTextPlugin("bundle.css") 
    ], 
    module: { 
    // 
    loaders: [ 
     { 
     test: /\.json/, 
     loader: 'json-loader', 
     }, 
     { 
     test: /\.ts$/, 
     loader: 'ts-loader', 
     }, 
     { test: /\.(png|jpg)$/, loader: 'url-loader?limit=8192' }, // inline base64 for <=8k images, direct URLs for the rest 
     { 
     test: /\.css$/, 
     loader: ExtractTextPlugin.extract("style", "css!postcss") 
     }, 
     { 
     test: /\.scss$/, 
     exclude: [/node_modules/], 
     loader: ExtractTextPlugin.extract("style", "css!postcss!sass?outputStyle=expanded") 
     }, 
     // fonts and svg 
     { test: /\.woff(\?v=\d+\.\d+\.\d+)?$/, loader: "url-loader?limit=10000&mimetype=application/font-woff" }, 
     { test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/, loader: "url-loader?limit=10000&mimetype=application/font-woff" }, 
     { test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, loader: "url-loader?limit=10000&mimetype=application/octet-stream" }, 
     { test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: "file" }, 
     { test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: "url-loader?limit=10000&mimetype=image/svg+xml" }, 
     { 
     test: /\.(ico|jpe?g|png|gif)$/, 
     loader: 'file' 
     } // inline base64 for <=8k images, direct URLs for the rest 
    ] 
    }, 
    postcss: function(webpack) { 
    return [ 
     autoprefixer({browsers: ['last 2 versions', 'ie >= 9', 'and_chr >= 2.3']}) 
    ] 
    }, 
    sassLoader: { 
    includePaths: [path.resolve(__dirname, "node_modules")] 
    }, 
    resolve: { 
    // now require('file') instead of require('file.coffee') 
    extensions: ['', '.ts', '.webpack.js', '.web.js', '.js', '.json', 'es6'] 
    }, 
    devtool: 'source-map' 
};

无法调试这个错误

来源

2016-03-21 Sahil Sharma

错误似乎并不存在。你的索引是怎样的？ –

您是否在运行时或构建时发现错误？如果它是前者，它可能仅仅是因为你的服务器不正确地服务你的index.html而不是bundle.js，因此浏览器试图将html评估为js？ – riscarrott

如果已创建，您应该分享您的bundle.js。这可能是由任何事情造成的。内部或外部图书馆，因为你捆绑整个事情。 – Venky

Uncaught SyntaxError: Unexpected token <

这很可能是一个错误：

被提出作为一个编译器错误的WebPack
被报告给你。

来源

2016-03-21 23:07:16 basarat

根据我的经验，出现该错误是因为在某些导入中，名称或文件类型错误。

您是否有html导入？

来源

2016-05-26 02:21:51 Koronos

检查这个好Angular2的WebPack样品

Angular 2 Webpack sample

这github上的项目演示了如何用Angular2以最小的配置使用的WebPack。

这里的WebPack配置的样品从这个项目

module.exports = { 
    entry: "./main.ts", 
    output: { 
     path: __dirname, 
     filename: "./dist/bundle.js" 
    }, 
    resolve : { 
     extentions: ['','.js','.ts'] 
    }, 
    module: { 
     loaders : [{ 
      test: /\.ts/, loaders : ['ts-loader'],exclude: /node_modules/ 
     }] 
    } 
};

来源

2016-06-06 08:00:32 Shettyh

尝试在你的模板（HTML）的顶部添加<!doctype html>。

来源

2016-09-08 22:04:13

Webpack + angular2

回答

相关问题