webpack2和angular2搭建的项目
github地址:项目链接
npm install
,安装依赖包npm run dev
,启动本地工程,在localhost:1699进行预览
Metadata": "^0.1.8","rxjs": "5.0.1","zone.js": "^0.8.4"
},"devDependencies": {
"babel-core": "^6.25.0","babel-loader": "^7.1.0","babel-preset-es2015": "^6.24.1","clean-webpack-plugin": "^0.1.16","css-loader": "^0.28.4","extract-text-webpack-plugin": "^2.1.2","path": "^0.12.7","style-loader": "^0.18.2","ts-loader": "^2.1.0","typescript": "^2.3.4","typings": "^2.1.1","uglifyjs-webpack-plugin": "^0.4.6","webpack": "^2.6.1","webpack-dev-server": "^2.5.0","webpack-merge": "^4.1.0"
}
}
webpack配置文件开发版:
let PORT = 1699;
let PUBLIC_PATH = "http://localhost:" + PORT + "/";
let webpackConifg = merge(config,{
devtool: "source-map",//debug: true,webpack2 已切换到plugins中,据说在3中将取消
entry: {
main: [
format("webpack-dev-server/client?%s",PUBLIC_PATH),"webpack/hot/dev-server","./src/main.ts"
]
},output: {
path: path.resolve(__dirname,'../../dist'),publicPath: PUBLIC_PATH,filename: '[name].js'
},plugins: [
new webpack.HotModuleReplacementPlugin()
]
})
const compiler = webpack(webpackConifg);
new webpackDevServer(compiler,{
inline: true,hot: true,port: PORT,stats: {
colors: true
}
}).listen(PORT,'localhost',(err) => {
console.log(123)
})
let PUBLIC_PATH = "http://localhost:" + PORT + "/";
let webpackConifg = merge(config,{
devtool: "source-map",//debug: true,webpack2 已切换到plugins中,据说在3中将取消
entry: {
main: [
format("webpack-dev-server/client?%s",PUBLIC_PATH),"webpack/hot/dev-server","./src/main.ts"
]
},output: {
path: path.resolve(__dirname,'../../dist'),publicPath: PUBLIC_PATH,filename: '[name].js'
},plugins: [
new webpack.HotModuleReplacementPlugin()
]
})
const compiler = webpack(webpackConifg);
new webpackDevServer(compiler,{
inline: true,hot: true,port: PORT,stats: {
colors: true
}
}).listen(PORT,'localhost',(err) => {
console.log(123)
})
搭建中遇到的问题:
The URL 'localhost:1699/sockjs-node' is invalid,
该问题是由于webpack配置文件中的publicPath前边没有加http://,导致url解析失败
Uncaught reflect-Metadata shim is required when using class decorators,