1,项目使用direct.js+ko做单页面应用,使用commonjs模块技术,用webpack做构建。由于页面中使用到了ko的虚拟元素,但是构建是丑化插件会将该虚拟元素删除,导致构建后的代码运行异常。
2.样例代码
var a = require('./js/a');
a();
<!-- ko foreach: items -->
<!-- /ko -->
console.log('hello world');
document.getElementById("container").innerHTML = "
hello world
";3,webconfig.js如下
var webpack = require('webpack');
var path = require('path');
var buildPath = path.resolve(__dirname,"build");
var nodemodulesPath = path.resolve(__dirname,'node_modules');
var config = {
//入口文件配置
entry:path.resolve(__dirname,'src/main.js'),
resolve:{
extentions:["","js"]//当requrie的模块找不到时,添加这些后缀
},
//文件导出的配置
output:{
path:buildPath,
filename:"app.js"
},
plugins: [
//压缩打包的文件
new webpack.optimize.UglifyJsPlugin({
compress: {
//supresses warnings, usually from module minification
warnings: false
},
comments:{
value:"/<!--ko/"
},
beautify:false
}),
//允许错误不打断程序
new webpack.NoErrorsPlugin(),
//把指定文件夹xia的文件复制到指定的目录
// new TransferWebpackPlugin([
// {from: 'www'}
// ], path.resolve(__dirname,"src"))
]
}
module.exports = config;
4,构建后的文件中,<!-- ko foreach: items --> 被截断了,只剩下 ko foreach: items -->
请教给位大神