html5如何调用.so库,HtmlWebpackPlugin用的html的ejs模板文件中如何使用条件判断

折腾：

期间，已经有了思路了，但是不知道如何在ejs的html中写条件判断

想要实现类似于这样的效果：

htmlwebpackplugin ejs template

没有找到要的。

参考：

倒是可以考虑，根据市dev还是prod去传入的参数，就是link的href添加的前缀

也是可以的。

支持if：

但是好像没有if else

此处，参考官网代码：

在webpack.config.js中添加了配置：

new HtmlWebpackPlugin({

template: ‘./src/index.template.ejs’,

// minify: { collapseWhitespace: true },

filename: ‘index.html’,

// inject: true,

hash: true,

isProdEnv: isProd

}),

的情况下，index.template.ejs中写上：

是可以在htmlWebpackPlugin.options.isProdEnv为true，生成：

在：htmlWebpackPlugin.options.isProdEnv为false，生成：

的。

当然，其实此处，更好的做法是：

直接传入，此处的href中的地址，需要添加的前缀，就可以了。

然后改为：

let wdsListenPort = 4000;

new HtmlWebpackPlugin({

template: ‘./src/index.template.ejs’,

// minify: { collapseWhitespace: true },

filename: ‘index.html’,

// inject: true,

hash: true,

assetsPrefix: isProd ? ” : `http://localhost:${wdsListenPort}/`

}),

和

assets/lib/bootstrap/bootstrap.min.css”>

npm run build，为production时，即可输出：

【总结】

此处用如下方式，实现了想要的效果：

当是开发环境时，从ejs模板生成的html中href的css，js都是：http://localhost:4000/assetsxxx的地址，

当是生产环境时，从ejs模板生成的html中href的css，js都是：assets/xxx的地址，

webpack.config.js

var HtmlWebpackPlugin = require(‘html-webpack-plugin’);

let isProd = (process.env.NODE_ENV === ‘production’);

let wdsListenPort = 4000;

new HtmlWebpackPlugin({

template: ‘./src/index.template.ejs’,

// minify: { collapseWhitespace: true },

filename: ‘index.html’,

// inject: true,

hash: true,

assetsPrefix: isProd ? ” : `http://localhost:${wdsListenPort}/`

}),

src/index.template.ejs

assets/lib/bootstrap/bootstrap.min.css”>

assets/lib/font-awesome/css/font-awesome.css”>

…

通过package.json配置了：

“scripts”: {

“dev”: “cross-env NODE_ENV=development webpack-dev-server –progress –colors –hot –inline”,

“lint”: “eslint src”,

“clean”: “rm -rf build/ build.zip”,

“package”: “zip -r build.zip build/”,

“prebuild”: “npm run clean”,

“build”: “cross-env NODE_ENV=production webpack -p –progress –colors”,

“postbuild”: “npm run package”

},

然后就可以：

npm run build去生产环境编译，所以编译出来的href地址都是：

npm run build去开发环境编译，所以编译出来的href地址都是：