AngularJS и Webpack4 - PullRequest
       17

AngularJS и Webpack4

0 голосов
/ 30 августа 2018

У меня есть проект AngularJS (1.5) с:

  1. Бауэр
  2. SCSS
  3. Ресурсы (SVG, PNG, JPG)
  4. Эйс

Мне нужно перенести его для работы с Webpack4, включая горячую перезагрузку. В настоящее время мы используем grunt для его сборки.

Мой текущий webpack.config.js:

const path                  = require('path');
const pkg                   = require('./package.json');
const webpack               = require('webpack');

const HtmlWebpackPlugin     = require("html-webpack-plugin");
const ExtractTextPlugin     = require('extract-text-webpack-plugin');
const MiniCssExtractPlugin  = require("mini-css-extract-plugin");

module.exports = {
    context: path.resolve(__dirname, 'public'),
    entry: [
        './js/app.js'
    ],
    output: {
        path: __dirname + "/dist",
        filename: "[name].bundle.js",
    },
    resolve: {
        modules: ['./public/lib', 'node_modules'],
        descriptionFiles: ['package.json', 'bower.json'],
        extensions: ['.js', '.json', '.html']
    },
    devtool: process.env.NODE_ENV !== 'production' ? "eval-source-map" : "source-map",
    module: {
        rules: [
            {
                test: /\.ejs/,
                use: [
                    {
                        // loader: "ejs-webpack-loader",
                        loader: "raw-loader",
                        options: {
                            htmlmin: false
                        }
                    }
                 ]
            },
            {
                test: /\.js$/,
                use: 'babel-loader',
                exclude: /node_modules/
            },
            {
                test: /\.scss$/,
                use: [
                    MiniCssExtractPlugin.loader,
                    'css-loader',
                    'sass-loader',
                ],
            }
        ]
    },
    plugins: [
        new MiniCssExtractPlugin({
            // Options similar to the same options in webpackOptions.output
            // both options are optional
            filename: "[name].css"
        }),
        new HtmlWebpackPlugin({
            template: '!!raw-loader!' + path.join(__dirname, 'public/views/index-output.ejs'),
            filename: 'index-build.ejs', // this line decide the extension of output file.
            minify: {
                removeComments: true,
                // collapseWhitespace: true,
                conservativeCollapse: true
            }
        })
    ]
};

Но это не работает для меня. Может кто-нибудь помочь мне с некоторыми советами?

Спасибо

...