webpack 相关

const HtmlWebpackPlugin = require('html-webpack-plugin');
const CopyPlugin = require("copy-webpack-plugin");
const {CleanWebpackPlugin} = require("clean-webpack-plugin");
var path = require('path');
module.exports = {
    entry: './src/main.js',
    output: {path: path.resolve(__dirname, './dist'), filename: 'app.js'},
    // resolve: {
    //     alias: {
    //         'vue$': 'vue/dist/vue.esm.js',
    //         '@': 'src'
    //     }
    // },
    module: {
        rules: [
            {
                test: /\.css$/i,
                use: ['style-loader', 'css-loader']
            },
            {
                test: /\.(png|jpg|gif)$/i,
                use: [
                    {
                        loader: 'url-loader',
                        options:
                            {
                                limit: 8192,
                                name: '[path][name].[ext]',
                            },
                    },
                ],
            },
            {
                test: /\.vue$/i,
                use: ['vue-loader']
            },
            // {
            //     test: /\.js$/,
            //     use: [{
            //         loader: 'babel-loader',
            //         options: {
            //             presets: ['react', 'env']
            //         }
            //     }],
            //     include: [
            //         path.resolve(__dirname, 'src')
            //     ]
            // }
        ],
    },
    plugins: [
        new CleanWebpackPlugin(),
        new HtmlWebpackPlugin({
            title: 'Custom template',
            template: 'index.html',
            inject: 'body'
        }),
        new CopyPlugin({
            patterns: [
                {from: "static", to: "static"},
            ],
        }),
    ]
};
//搭建环境------------------------------------------------------------
//package.json文件
npm init

//安装webpack
npm install webpack -g
npm install webpack-cli -g

//插件
npm install html-webpack-plugin --save-dev
npm install css-loader style-loader --save-dev
npm install file-loader --save-dev
npm install url-loader --save-dev
npm install copy-webpack-plugin --save-dev
npm install clean-webpack-plugin --save-dev

//简单打包
webpack ./a.js   ./bundle.js
//配置打包
webpack --config webpack.config.js

//vue开发------------------------------------------------------------------------
npm install vue
npm install vue-loader --save-dev
npm install babel-loader --save-dev

 

 

posted on 2021-02-07 16:07  biind  阅读(71)  评论(0编辑  收藏  举报