
Михаил
08.01.2017
13:02:09
в pug файле указал путь к картинке src/img/some.svg
после запуска angularjs пишет /img/some.svg error 404
картинка доступна по /src/img/some.svg
в loaders прописал
{
test: /\.(png|jpe?g||svg|ico)$/,
loader: 'file-loader?name=[name].[ext]&publicPath=src/img/&outputPath=src/img/'
}

Denis
08.01.2017
13:14:11
||
module: {
loaders: [
{
test: /\.pug$/,
loader: 'pug-loader',
},
{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel-loader',
},
{
test: /\.css$/,
loader: ExtractPlugin.extract('style-loader', 'css-loader!postcss-loader'),
},
{
test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
loader: 'file-loader',
query: {
name: '[path][name].[ext]',
content: cfg.dir.asset,
}
},
],
},
module: {
loaders: [
{
test: /\.pug$/,
loader: 'pug-loader',
},
{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel-loader',
},
{
test: /\.css$/,
loader: ExtractPlugin.extract('style-loader', 'css-loader!postcss-loader'),
},
{
test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
loader: 'file-loader',
query: {
name: '[path][name].[ext]',
content: cfg.dir.asset,
}
},
],
},
Весь basic config
/**
* This is basic webpack config file;
*
* @author Denis Maslennikov <mrdenniska@gmail.com> (nofach.com)
* @license MIT
*/
/** Dependencies */
const webpack = require('webpack');
/** Dependencies for webpack */
const ExtractPlugin = require('extract-text-webpack-plugin');
const HTMLPlugin = require('html-webpack-plugin');
/** Dependencies for postcss */
const autoprefixer = require('autoprefixer');
const $import = require('postcss-import');
const precss = require('precss');
/** A config of project */
const cfg = require('./config.js');
/** Configure */
module.exports = {
context: cfg.dir.app,
entry: {
vendor: [ 'normalize.css', 'clipboard' ],
app: './app.js',
},
output: {
filename: '[name].bundle.js',
chunkFilename: '[id].bundle.js',
path: cfg.dir.build,
publicPath: cfg.public,
},
resolve: {
extensions: [ '', '.js' ],
},
module: {
loaders: [
{
test: /\.pug$/,
loader: 'pug-loader',
},
{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel-loader',
},
{
test: /\.css$/,
loader: ExtractPlugin.extract('style-loader', 'css-loader!postcss-loader'),
},
{
test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
loader: 'file-loader',
query: {
name: '[path][name].[ext]',
content: cfg.dir.asset,
}
},
],
},
postcss: () => {
return [
$import(),
precss(),
autoprefixer(),
];
},
plugins: [
new webpack.optimize.CommonsChunkPlugin({
filename: 'vendor.bundle.js',
name: 'vendor',
}),
new HTMLPlugin({
filename: 'index.html',
template: 'index.pug',
inject: 'body',
}),
new ExtractPlugin('[name].bundle.css', {
allChunks: true,
}),
]
};
/**
* This is config for development mode
*
* @author Denis Maslennikov <mrdenniska@gmail.com> (nofach.com)
* @license MIT
*/
/** Dependencies */
const webpack = require('webpack');
const merge = require('webpack-merge');
/** The basic webpack config */
const basic = require('./webpack.config.js');
/** Configure */
module.exports = merge(basic, {
devtool: '#eval-source-map',
devServer: {
host: '0.0.0.0',
port: '8080',
progress: true,
inline: true,
hot: true,
},
entry: {
hot: [
'webpack-dev-server/client?',
'webpack/hot/dev-server',
],
},
plugins: [
new webpack.optimize.OccurenceOrderPlugin(),
new webpack.HotModuleReplacementPlugin(),
new webpack.NoErrorsPlugin(),
new webpack.DefinePlugin({
'process.env': { NODE_ENV: JSON.stringify('development') },
}),
]
});