sinneren
@sinneren

Почему _.template не подгружает соседний файл?

На свою голову решил перейти с gulp на webpack. Взял за основу чью-то сборку с хабра.
Там используются основные файлы шаблонов во view и модули в includes. Проблема в том, что мне нужно загрузить один файл из includes в другой там же. Но выходит ошибка. Не поможете решить проблему?

Подключаю как <%= _.template(require('user.html'))() %> файл в той же папке

Trace ошибки:
Html Webpack Plugin:
  Error: Cannot find module 'user.html'
  
  - module.js:20 require
    internal/module.js:20:19
  
  - lodash.templateSources[4]:9 eval
    lodash.templateSources[4]:9:22
  
  - article.html:98 
    C:/Project/layout/src/html/views/article.html:98:114
  
  - article.html:103 ./node_modules/html-webpack-plugin/lib/loader.js!./src/html/views/article.html.module.exports
    C:/Project/layout/src/html/views/article.html:103:3
  
  - index.js:277 Promise.resolve.then.e
    [layout]/[html-webpack-plugin]/index.js:277:18


Код конфига вебпака 4:
const path = require('path');
const fs = require('fs');
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const CopyWebpackPlugin = require('copy-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const WriteFilePlugin = require('write-file-webpack-plugin');
const autoprefixer = require('autoprefixer');
const env = process.argv.slice(2);
const config = {
    mode: env[1] || 'development'
}
function generateHtmlPlugins(templateDir) {
    const templateFiles = fs.readdirSync(path.resolve(__dirname, templateDir));
    return templateFiles.map(item => {
        const parts = item.split('.');
        const name = parts[0];
        const extension = parts[1];
        return new HtmlWebpackPlugin({
            filename: `${name}.html`,
            template: path.resolve(__dirname, `${templateDir}/${name}.${extension}`),
            inject: false,
        })
    })
}

const htmlPlugins = generateHtmlPlugins('./src/html/views')

module.exports = {
    entry: [
        './src/scss/scope.scss'
    ],
    output: {
        path: path.resolve(__dirname, config.mode)
    },
    devtool: "source-map",
    module: {
        rules: [
            {
                test: /\.(sass|scss)$/,
                include: path.resolve(__dirname, 'src/scss'),
                use: ExtractTextPlugin.extract({
                    use: [{
                        loader: "css-loader",
                        options: {
                            sourceMap: true,
                            minimize: true,
                            url: false
                        }
                    },
                    {
                        loader: "postcss-loader",
                        options: {
                            plugins: [
                                autoprefixer({
                                    browsers: ['ie >= 9', 'last 4 version']
                                })
                            ],
                            sourceMap: true
                        }
                    },
                    {
                        loader: "sass-loader",
                        options: {
                            sourceMap: true
                        }
                    }
                    ]
                })
            },
            {
                test: /\.html$/,
                include: path.resolve(__dirname, 'src/html/includes'),
                use: ['raw-loader']
            },
        ]
    },
    plugins: [
        new ExtractTextPlugin({
            filename: './css/style.bundle.css',
            allChunks: true,
        }),
        new CleanWebpackPlugin(['production', 'development']),
        new WriteFilePlugin(),
        new CopyWebpackPlugin([
            {
                from: './src/img',
                to: './img'
            },
            {
                from: './src/scss/font-awesome-4.5.0/fonts',
                to: './fonts'
            },
            {
                from: './src/js',
                to: './js'
            }
        ]),
    ].concat(htmlPlugins)
};
  • Вопрос задан
  • 794 просмотра
Пригласить эксперта
Ответы на вопрос 1
Krasnodar_etc
@Krasnodar_etc
avito front
<%= _.template(require('./user.html'))() %>

Вебпаку лучше указывать относительные пути
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы