'use strict' const webpack = require('webpack') const path = require('path') const utils = require('./utils') const config = require('../config') const vueLoaderConfig = require('./vue-loader.conf') //头部引入css打包插件 const ExtractTextPlugin = require("extract-text-webpack-plugin"); var projectRoot = path.resolve(__dirname, '../') function resolve (dir) { return path.join(__dirname, '..', dir) } module.exports = { entry: { app: ['babel-polyfill','./src/main.js'], }, plugins: [ new webpack.ProvidePlugin({ $: "jquery", jQuery:"jquery", "window.jQuery":"jquery" }), ], output: { path: config.build.assetsRoot, filename: '[name].js', publicPath: process.env.NODE_ENV === 'production' ? config.build.assetsPublicPath : config.dev.assetsPublicPath }, resolve: { extensions: ['.js', '.vue', '.json'], alias: { 'vue$': 'vue/dist/vue.esm.js', 'alte':'admin-lte/dist', 'alt-plugin':'admin-lte/plugins', '@': resolve('src') } }, module: { rules: [ { test: /\.vue$/, use:[{ loader: 'vue-loader', options: vueLoaderConfig },{ loader: 'iview-loader', options: { prefix: false } }] }, { test: /\.js$/, loader: 'babel-loader', include: projectRoot, exclude: /node_modules/ }, //{ // test: /\.css$/, // //请注意loader里的写法,有一些低版本的例子中是过时的写法 // loader: ExtractTextPlugin.extract({ // fallback: "style-loader", // use: "css-loader" // }) //}, { test: /\.(png|jpe?g|gif|svg)(\?.*)?$/, loader: 'url-loader', options: { limit: 10000, name: utils.assetsPath('img/[name].[hash:7].[ext]') } }, { test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/, loader: 'url-loader', options: { limit: 10000, name: utils.assetsPath('media/[name].[hash:7].[ext]') } }, { test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/, loader: 'url-loader', options: { limit: 10000, name: utils.assetsPath('fonts/[name].[hash:7].[ext]') } } ] }, externals: { /** * webpack 中的 externals 配置提供了不从 bundle 中引用依赖的方式。 * 解决的是,所创建的 bundle 依赖于那些存在于用户环境(consumer environment)中的依赖。 */ // 'jquery': 'jQuery', //'vue': 'Vue', echarts: 'echarts', } }