Vue引入Stylus知识点总结
项目中使用引入文件有时候路径比较深，需要使用"../../../xx.js"这种类似的路劲引入，这种方式比较笨，可以使用webpack的别名alias配置来解决。
首先，先确定项目中是否有path模块：
如果没有path模块需要先安装path
npminstallpath--save
以下为vue.config.js配置
constpath=require("path");
functionresolve(dir){
returnpath.join(__dirname,dir);
}
module.exports={
chainWebpack:config=>{
config.resolve.alias
.set("@",resolve("src"))
.set("assets",resolve("src/assets"))
.set("components",resolve("src/components"))
.set("base",resolve("baseConfig"))
.set("public",resolve("public"));
},
}
项目开发阶段经常需要console一些测试数据，查看开发过程中遇到的问题，但生产环境中这些console数据需要清掉，以前操作是项目配置一个全局的标志，判断是否打印console数据，近期发现一个更简便的方法，通过webpack配置生产环境自动清除console。
首先，安装uglifyjs-webpack-plugin插件：
npminstalluglifyjs-webpack-plugin--save
其次，在vue.config.js文件引入插件。
最后，配置configureWebpack如下代码：
constUglifyJsPlugin=require("uglifyjs-webpack-plugin");//引入插件
module.exports={
configureWebpack:{
optimization:{
minimizer:[
newUglifyJsPlugin({
uglifyOptions:{
compress:{
warnings:false,
drop_console:true,//console
drop_debugger:false,
pure_funcs:["console.log"]//移除console
}
}
})
]
}
},
}
以上就是本次介绍的Vue引入Stylus的全部知识点，感谢大家的学习和对毛票票的支持。
声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。