webpack学习笔记

-------------------------------------------

css-loader!./style.css
意思为：加载style.css，要先经过css-loader编译
!为链接的意思，将几个加载器连接在一起

-------------------------------------------

--save  会在package.json的dependencies属性中添加信息，
并且在 “npm install”时，自动安装模板

-dev  会在package.json的devDependencies属性中添加信息，

devDependencies  里面的插件只用于开发环境，不用于生产环境，
而 dependencies  是需要发布到生产环境的。

-------------------------------------------

webpack.config.js详解
module.exports = {                        common.js模块
    entry: './src/main.js',                主入口，内含各组件
    output: {                            出口
        path: './dist/js',                主编译文件放置位置    
        filename: 'bundle.js'            各组件经webpack编译打包后的文件，
    }
}
注：filename: 'bundle.js' 应尽量采用[name].js 占位符模式
name采用了项目名称

-------------------------------------------

var xxx = require('xxxx')
commonjs 的模块引用写法

-------------------------------------------

var path =require('path')
path.resolve(__dirname,'xx/xx')
“path”带着“__dirname”(当前目录)，“resolve”(解析)“xx/xx”(相对路径)，得到绝对路径

-------------------------------------------

test: /\.css$/, loader: 'style-loader!css-loader?importLoaders=1!postcss-loader'
"?importLoaders=1"(参数)：
表示在cssloader后指定1个loader来处理引入进来的代码

-------------------------------------------

主要注意：
一旦设置了触发点，就一定要写方法，
避免没有写方法，程序无法成立