webpack項目調試
-sourcemap
webpack配置提供了devtool這個選項，如果設置為 ‘#source-map'，則可以生成.map文件，在chrome瀏覽器中調試的時候可以顯示源代碼。
devtool: '#source-map'webpack獨立生成可修改的配置文件用generate-asset-webpack-plugin這個插件，在webpack.prod.config.js中去生成configServer.json文件，讓其build的時候生成json文件，然后時候get方法異步獲取json，替換url即可具體做法：先安裝generate-asset-webpack-plugin插件npm install --save-dev generate-asset-webpack-plugin在webpack.prod.conf.js里面配置
//讓打包的時候輸出可配置的文件var GenerateAssetPlugin = require('generate-asset-webpack-plugin'); var createServerConfig = function(compilation){ let cfgJson={ApiUrl:"http://139.129.31.108:8001"}; return JSON.stringify(cfgJson);}//讓打包的時候輸入可配置的文件 new GenerateAssetPlugin({ filename: 'serverconfig.json', fn: (compilation, cb) => { cb(null, createServerConfig(compilation)); }, extraFiles: [] })打包之后，在根目錄就會生成serverconfig.json文件
使用(vue-resourse)：
Vue.http.get("serverconfig.json").then((result)=>{ localStorage.setItem('ApiUrl',result.data.ApiUrl); console.log(localStorage.getItem('ApiUrl')); }).catch((error)=>{console.log(error)});則可以獲取到serverconfig.json里面的key ApiUrl的值，需要注意的是，由于是異步操作，為了通信，可以采用localstorage，把東西存起來，即localstorage.setItem；使用的時候可以用localstorage.getItem
以上這篇webpack項目調試以及獨立打包配置文件的方法就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持武林網。
新聞熱點
疑難解答
