我使用html-loader加载我的html模板和文件加载器来加载模板中的图像.这在dev中运行得很好但是当我运行build:prod并运行输出时,我得到一个模板解析错误.
似乎所有angular2内置指令(例如,*ngFor,*ngIf)都被转换为全部小写(例如,*ngfor,*ngif),这些都是错误的例子.
我尝试创建一个单独的项目,这一次,不使用角度2的任何内置指令,一切正常.
我可以使用另一台装载机吗？如何正确加载这些模板以及这些模板使用的图像？
这是我的webpack.config
var webpack = require('webpack');
var HtmlWebPackPlugin = require('html-webpack-plugin');
var path = require('path');
module.exports = {
entry:'./src/main.ts',
output:{
path:'./dist',
filename:'app.bundle.js'
},
module:{
loaders:[{test:/\.ts$/, loader:'ts-loader'},
{ test: /\.css$/, loaders: ['to-string-loader', 'css-loader'] },
{ test: /\.html$/, loader: 'html-loader' },
{test: /\.(jpe?g|png|gif|svg)$/i, loader: "file-loader"},
//{ test: /\.html$/, loader: 'raw-loader' },
//{ test: require.resolve('jquery'), loader: 'expose?jQuery!expose?$' }
]
/* loaders: [
// .ts files for TypeScript
{ test: /\.ts$/, loaders: ['awesome-typescript-loader', 'angular2-template-loader'] },
{ test: /\.css$/, loaders: ['to-string-loader', 'css-loader'] }, …dev-server，我的 webpack 将构建包含 jquery 的包。
我使用 html-webpack-plugin，下面的代码行将在构建产品时将我的包注入到正文中。
new HtmlWebPackPlugin({
template: './src/index.html'
}),
我的问题是，在我的index.html中，我有semantic-ui.js，它依赖于Jquery，
<body>
<my-app>loading...thaison</my-app>
<script src="./asset/semantic-ui/dist/semantic.min.js"></script>
</body>
因此，当我触发我的开发环境或产品构建时，捆绑包出现在语义之后，因此我有一个错误。如何使开发注入发生在我的手动脚本源之前？
开发服务器服务：
webpack-dev-server --inline --progress --port 4000 --content-base src