欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Vue引入Stylus知識點總結(jié)

 更新時間:2020年01月16日 15:58:56   作者:清風徐來。  
在本篇文章里小編給各位整理的是一篇關于Vue引入Stylus知識點總結(jié)內(nèi)容,有需要的朋友們可以學習參考下。

項目中使用引入文件有時候路徑比較深,需要使用"../../../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的全部知識點,感謝大家的學習和對腳本之家的支持。

相關文章

最新評論