使用webpack

时间:2016-08-17 01:09:19

标签: webpack webpack-dev-server

我有一些我想在开发模式下提供的模拟数据文件,但是从我的包中排除。

我的项目结构是:

/src/
    index.html
    Router.jsx
    /components
    /mockdata <- I don't need this guy in my bundle.js

是否可以从我的捆绑包中排除/mockdata目录,但仍然可以通过webpack-dev-server提供文件?我没有在webpack文档的输出部分看到任何内容,但我希望有一个解决方法。

/mockdata目录中的文件是通过ajax加载的。我的webpack配置分为两部分:

开发

// webpack.config.js

/*eslint-env node*/
var path = require('path');
var webpack = require('webpack');

module.exports = {
  devServer: {
    historyApiFallback: true,
    port: 3000
  },
  entry: './src/Router.jsx',
  output: {
    filename: 'bundle.js',
    path: path.join(__dirname, 'dist')
  },
  plugins: [
    new webpack.ProvidePlugin({
      React: "react"
    })
  ],
  module: {
    loaders: [
      {
        test: /\.(css|less)$/,
        loader : 'style!css!less'
      },
      {
        test: /\.(js|jsx|es6)$/,
        exclude: /node_modules/,
        loader: 'babel'
      },
      {
        test: /\.html$/,
        loader: 'file?name=[name].[ext]'
      }
    ]
  },
  resolve: {
    root: path.resolve(path.join(__dirname, 'src')),
    modulesDirectories: [
      'node_modules'
    ],
    extensions: ['', '.js', '.jsx', '.es6']
  }
};

和生产:

// webpack.prod.config.js

var config = require('./webpack.config.js');
var webpack = require('webpack');
var CopyWebpackPlugin = require('copy-webpack-plugin');

config.plugins.push(
  new webpack.DefinePlugin({
    "process.env": {
      "NODE_ENV": JSON.stringify("production")
    }
  })
);

config.plugins.push(
  new webpack.optimize.DedupePlugin()
);

config.plugins.push(
  new webpack.optimize.OccurenceOrderPlugin()
);

config.plugins.push(
  new webpack.optimize.MinChunkSizePlugin({
      minChunkSize: 51200, // ~50kb
  })
);

config.plugins.push(
  new webpack.optimize.UglifyJsPlugin({
    mangle: true,
    compress: {
      warnings: false
    },
    output: {
      comments: false
    }
  })
);

config.plugins.push(
  new CopyWebpackPlugin([
    {
      from: 'src/static',
      to: 'static'
    },
    {
      from: 'src/index.html'
    }
  ])
);

module.exports = config;

0 个答案:

没有答案