标签：git 后缀 查找 re模块 配置 包含 页面 路径 复用
使用webpack工具需要配置一个根目录下的配置文件，文件名默认为webpack.condfig.js，配置文件导出一个模块对象，包含了webpack工具的相关配置参数，这个模块对象将会以参数形式被引用。
该参数对象指明了入口文件的配置:
//页面入口文件配置 entry: { demo : [baseUrl + "demo.js"], },
该参数对象指明了文件被工具经过打包等操作后的输出配置，包括输出的文件的存放位置和文件名称等:
//文件输出配置 output: { path: ‘src/js‘, filename: ‘[name].js‘, },
该参数对象指明了工具将应用上哪些插件，每个插件都被封装为一个类，引用时需要new生产，例如：
webpack/lib/optimize/CommonsChunkPlugin:该插件用于封装文件间公共复用的部分，使代码更合理，简洁。
webpack.ProvidePlugin: 该插件用于为了避免重复在每个模块里重复require我们需要的库，集中设置这些引用的库并直接使用在每个模块中。
//插件项 plugins: [ new CommonsChunkPlugin("common.js"), new webpack.ProvidePlugin({ $ : "jquery", }), ],
该参数对象指明了相关加载器配置，加载器非常有用，它保证了工具对现有的前端资源的扩展性，它可以加载并解析各种前端资源，相应的加载器需要npm install安装。
module: { //加载器配置 loaders: [ { test: /\.css$/, loader: ‘style-loader!css-loader‘ }, { test: /\.(js|jsx)$/, loader: ‘jsx-loader?harmony‘ }, { test: /\.scss$/, loader: ‘style!css!sass?sourceMap‘}, { test: /\.(png|jpg)$/, loader: ‘url-loader?limit=25000‘}, { test: /\.(hbs|html)$/, loader: "handlebars"}, ] },
该参数指明了其他基本配置，
resolve: { //查找module的话从这里开始查找 root: ‘E:/github/flux-example/src‘, //绝对路径 //自动扩展文件后缀名，意味着我们require模块可以省略不写后缀名 extensions: [‘‘, ‘.js‘, ‘.json‘, ‘.scss‘], //模块别名定义，方便后续直接引用别名，无须多写长长的地址 alias: { AppStore : ‘js/stores/AppStores.js‘,//后续直接 require(‘AppStore‘) 即可， ActionType : ‘js/actions/ActionType.js‘, AppAction : ‘js/actions/AppAction.js‘ } }
var webpack = require(‘webpack‘); var CommonsChunkPlugin = require("webpack/lib/optimize/CommonsChunkPlugin"); var baseUrl = "./src/dev/pactions/"; module.exports = { //页面入口文件配置 entry: { demo : [baseUrl + "demo.js"], }, //文件输出配置 output: { path: ‘src/js‘, filename: ‘[name].js‘, }, //插件项 plugins: [ new CommonsChunkPlugin("common.js"), new webpack.ProvidePlugin({ $ : "jquery", }), ], module: { //加载器配置 loaders: [ { test: /\.css$/, loader: ‘style-loader!css-loader‘ }, { test: /\.js$/, loader: ‘jsx-loader?harmony‘ }, { test: /\.scss$/, loader: ‘style!css!sass?sourceMap‘}, { test: /\.(png|jpg)$/, loader: ‘url-loader?limit=4096‘}, {test: require.resolve(‘jquery‘), loader: ‘expose-loader?$‘}, ] }, //其它解决方案配置 resolve: { root:‘G:/baseNode/baseNd/baseNd/views‘, //绝对路径 extensions: [‘‘, ‘.js‘, ‘.json‘, ‘.scss‘], alias: { AppStore : ‘js/stores/AppStores.js‘, ActionType : ‘js/actions/ActionType.js‘, AppAction : ‘js/actions/AppAction.js‘ } } };
标签：git 后缀 查找 re模块 配置 包含 页面 路径 复用
原文地址：http://www.cnblogs.com/zhu-xingyu/p/6104853.html
