Vue引入Stylus知识点总结


Posted in Javascript onJanuary 16, 2020

项目中使用引入文件有时候路径比较深,需要使用"../../../xx.js"这种类似的路劲引入,这种方式比较笨,可以使用webpack的别名alias配置来解决。

首先,先确定项目中是否有path模块:

Vue引入Stylus知识点总结

如果没有path模块需要先安装path

npm install path --save

以下为vue.config.js配置

const path = require("path");
function resolve(dir) {
 return path.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插件:

npm install uglifyjs-webpack-plugin --save

其次,在vue.config.js文件引入插件。

最后,配置configureWebpack如下代码:

const UglifyJsPlugin = require("uglifyjs-webpack-plugin"); // 引入插件

module.exports = {
 configureWebpack: {
  optimization: {
   minimizer: [
    new UglifyJsPlugin({
     uglifyOptions: {
      compress: {
       warnings: false,
       drop_console: true, //console
       drop_debugger: false,
       pure_funcs: ["console.log"] //移除console
      }
     }
    })
   ]
  }
 },
}

以上就是本次介绍的Vue引入Stylus的全部知识点,感谢大家的学习和对三水点靠木的支持。

Javascript 相关文章推荐
在jQuery ajax中按钮button和submit的区别分析
Oct 07 Javascript
jQuery实用基础超详细介绍
Apr 11 Javascript
使用Jquery获取带特殊符号的ID 标签的方法
Apr 30 Javascript
Javascript正则控制文本框只能输入整数或浮点数
Sep 02 Javascript
node.js中的fs.writeFile方法使用说明
Dec 14 Javascript
js实现仿百度风云榜可重复多次调用的TAB切换选项卡效果
Aug 31 Javascript
Javascript中this绑定的3种方法与比较
Oct 13 Javascript
详解如何实现Element树形控件Tree在懒加载模式下的动态更新
Apr 25 Javascript
详解微信小程序-扫一扫 wx.scanCode() 扫码大变身
Apr 30 Javascript
js仿360开机效果
Dec 26 Javascript
微信小程序 flexbox layout快速实现基本布局的解决方案
Mar 24 Javascript
javascript+Canvas实现画板功能
Jun 23 Javascript
js实现提交前对列表数据的增删改查
Jan 16 #Javascript
react实现移动端下拉菜单的示例代码
Jan 16 #Javascript
vue项目中使用eslint+prettier规范与检查代码的方法
Jan 16 #Javascript
JS实现简单的表格增删
Jan 16 #Javascript
JS实现基本的网页计算器功能示例
Jan 16 #Javascript
JS数组进阶示例【数组的几种函数用法】
Jan 16 #Javascript
js实现简单的秒表
Jan 16 #Javascript
You might like
Laravel 中获取上一篇和下一篇数据
2015/07/27 PHP
Thinkphp 框架扩展之Widget扩展实现方法分析
2020/04/23 PHP
Add Formatted Text to a Word Document
2007/06/15 Javascript
用JavaScrpt实现文件夹简单轻松加密的实现方法图文
2008/09/08 Javascript
用jquery和json从后台获得数据集的代码
2011/11/07 Javascript
js获取html参数及向swf传递参数应用介绍
2013/02/18 Javascript
获取内联和链接中的样式(js代码)
2013/04/11 Javascript
js判断数据类型如判断是否为数组是否为字符串等等
2014/01/15 Javascript
基于Jquery实现键盘按键监听
2014/05/11 Javascript
IE8中使用javascript动态加载CSS的解决方法
2014/06/17 Javascript
readonly和disabled属性的区别
2015/07/26 Javascript
JavaScript小技巧整理
2015/12/30 Javascript
谈一谈js中的执行环境及作用域
2016/03/30 Javascript
过期软件破解办法实例详解
2017/01/04 Javascript
基于jQuery实现简单人工智能聊天室
2017/02/10 Javascript
微信小程序 图片加载(本地,网路)实例详解
2017/03/10 Javascript
jquery tmpl模板(实例讲解)
2017/09/02 jQuery
微信小程序实现城市列表选择
2018/06/05 Javascript
vuex + axios 做登录验证 并且保存登录状态的实例
2018/09/16 Javascript
微信小程序的tab选项卡的实现效果
2019/05/15 Javascript
微信小程序设置滚动条过程详解
2019/07/25 Javascript
angula中使用iframe点击后不执行变更检测的问题
2020/05/10 Javascript
[03:22]DOTA2超级联赛专访单车:找到属于自己的英雄
2013/06/08 DOTA
Python实现获取前100组勾股数的方法示例
2018/05/04 Python
python遍历文件夹,指定遍历深度与忽略目录的方法
2018/07/11 Python
为什么你还不懂得怎么使用Python协程
2019/05/13 Python
python函数与方法的区别总结
2019/06/23 Python
python 并发编程 阻塞IO模型原理解析
2019/08/20 Python
Python实现对word文档添加密码去除密码的示例代码
2020/12/29 Python
德国亚洲食品网上商店:asiafoodland.de
2019/12/28 全球购物
优秀党支部事迹材料
2014/01/14 职场文书
2014升学宴答谢词
2014/01/26 职场文书
可口可乐广告词
2014/03/20 职场文书
企业标语大全
2014/07/01 职场文书
2015驻村干部工作总结
2015/04/07 职场文书
nginx lua 操作 mysql
2022/05/15 Servers