webpack打包邏輯，配置，如何識別內部命令，原始只識別js，非js靜態資源需要通過loader進行額外配置
npm install安裝webpack vue vue-loader css-loader vue-template-compiler style-loader file-loader url-loader webpack-dev-server
vue 文件 <template <script <stlye 這種只是一個組件，內部存在不同樣式，無法直接在瀏覽器中運行，沒法掛載,這種文件類型也需要被loader
webpack.config.js 用於配置，打包資源的，通過http請求加載的內容
const path = require()
module.exports={
target:'web',
entry:path.join(_dirname,'src/index.js') //路徑添加，絕對路徑
output:{
filename:xxx
path:xxx
}
moudle:{
rules:[
{test:/\.vue$/,loader:'vue-loader' //通過vue-loader爲.vue文件處理文件類型內部}，
{test:/\.css/,use:['style-loader','css-loader']},
{test:/\..styl/,use:['style-loader','css-loader','stylus-loader']},
每一個loader只關注自己範圍內的內容
{test:/\.(gif|jpg|jpeg|png|svg)&/,use:[{loader:'url-loader',options:{limit:1024,name:[name]-aaa.[ext]}//通過options，指定loader的操作方式, //ext是擴展名}]}
]}}
//非js內容都需要進行處理，如上
注意區分不同的webpack，有全局的和自己設置的.需要在package.json 下，scripts下的build中進行更改，使系統默認進入我們自行設置的webpack配置中，而不是使用全局的
"scripts":{
"build":"webpack --config webpack.config.js",
"dev":"webpack-dev-server --config webpack.config.js",
}
文件入口文件 index.js
//掛載組件
import Vue from 'vue'
import App from './app.vue'
//進行展示和掛載
const root = document.createElement('div')
document.body.appendChild(root)
//新建vue
new Vue({
render:(h)=>h(App)
}).$mount(root)
webpack內存在很多js內部依賴的文件
css預處理器
test-stylus-styl文件