Vue引入Stylus知識點總結(jié)
項目中使用引入文件有時候路徑比較深,需要使用"../../../xx.js"這種類似的路勁引入,這種方式比較笨,可以使用webpack的別名alias配置來解決。
首先,先確定項目中是否有path模塊:
如果沒有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")); }, }
項目開發(fā)階段經(jīng)常需要console一些測試數(shù)據(jù),查看開發(fā)過程中遇到的問題,但生產(chǎn)環(huán)境中這些console數(shù)據(jù)需要清掉,以前操作是項目配置一個全局的標志,判斷是否打印console數(shù)據(jù),近期發(fā)現(xiàn)一個更簡便的方法,通過webpack配置生產(chǎn)環(huán)境自動清除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的全部知識點,感謝大家的學習和對腳本之家的支持。
相關文章
vuex存儲數(shù)組(新建,增,刪,更新)并存入localstorage定時刪除功能實現(xiàn)
這篇文章主要介紹了vuex存儲數(shù)組(新建,增,刪,更新),并存入localstorage定時刪除,本文通過示例代碼給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下2023-04-04vue關于重置表單數(shù)據(jù)出現(xiàn)undefined的解決
這篇文章主要介紹了vue關于重置表單數(shù)據(jù)出現(xiàn)undefined的解決方案,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-09-09詳解vue.js數(shù)據(jù)傳遞以及數(shù)據(jù)分發(fā)slot
本篇文章給大家通過代碼實例分析了vue.js數(shù)據(jù)傳遞以及數(shù)據(jù)分發(fā)slot的相關知識,有這方面興趣的朋友參考下吧。2018-01-01