zoukankan      html  css  js  c++  java
  • 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

     

    天生我材必有用,千金散尽还复来
  • 相关阅读:
    linux常用命令-新手入门
    centos-1908安装步骤
    存储过程和函数的一些范例
    在iis7上如何配置来看到asp报错
    如何在ashx页面获取Session值
    SQL--create Table
    NET内存持续增长问题排查
    Socket之服务调用
    编程心得
    vs中无法查找或打开PDB文件
  • 原文地址:https://www.cnblogs.com/ligenyun/p/14385597.html
Copyright © 2011-2022 走看看