我正在为以下项目提供设置-
.babelrc -
{
"presets": ["es2015", "stage-0"]
}
的package.json -
{
"name": "angular-quickstart",
"version": "1.0.0",
"description": "",
"main": "index.js",
"dependencies": {
"angular2": "^2.0.0-beta.11",
"es6-promise": "latest",
"es6-shim": "^0.35.0",
"reflect-metadata": "^0.1.3",
"rxjs": "latest",
"zone.js": "^0.6.6"
},
"devDependencies": {
"awesome-typescript-loader": "^0.16.2",
"babel-core": "^6.7.4",
"babel-loader": "^6.2.4",
"babel-preset-es2015": "^6.6.0",
"babel-preset-stage-0": "^6.5.0",
"webpack": "^1.12.14"
},
"scripts": {},
"author": "",
"license": "ISC"
}
Webpack.config.js -
var path = require('path'),
webpack = require('webpack'),
ForkCheckerPlugin = require('awesome-typescript-loader').ForkCheckerPlugin;
module.exports = {
devtool: 'eval-source-map',
entry: {
main: [
'./src/app'
]
},
output: {
filename: './[name].js',
path: path.join(__dirname, 'public'),
publicPath: '/public/'
},
resolve: {
// An array of extensions that should be used to resolve modules.
//
// See: http://webpack.github.io/docs/configuration.html#resolve-extensions
extensions: ['', '.ts', '.js'],
// Make sure root is src
root: path.join(__dirname, 'src'),
},
plugins: [
new webpack.HotModuleReplacementPlugin(),
new ForkCheckerPlugin(),
],
module: {
loaders: [{
test: /\.js?$/,
exclude: path.join(__dirname, 'src'),
loaders: ['babel']
}, {
test: /\.ts$/,
loader: 'awesome-typescript-loader',
exclude: [/\.(spec|e2e)\.ts$/]
}, ],
}
}
root.component.js -
import {
Component
}
from 'angular2/core';
@Component({
selector: "my-app",
template: '<h1>hello Joy</h1>'
})
export class RootComponent {
constructor() {
}
}
当我运行的命令时web pack
。它给我下面的错误-
ERROR in ./src/app.js
Module parse failed: /Users/Joy/Documents/Work/Javascript/Angular-quickstart/src/app.js Line 1: Unexpected token
You may need an appropriate loader to handle this file type.
| import bootstrap from 'angular2/platform/browser';
| import RootComponent from './components/root.component';
|
@ multi main
任何人都知道为什么这会给我造成麻烦。它几乎与React应用程序相同。这仅用于无反应的angular2.0。IT的行为应相同。
loaders: [{
test: /\.js?$/,
exclude: path.join(__dirname, 'src'),
loaders: ['babel']
实际上,您完全需要用于src的babel,并将其排除在外。应该是这样的:
loaders: [{
test: /\.js$/,
loader: 'babel',
exclude: /node_modules|bower_components/
}
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句