Comments (10)
I can't seem to reproduce this issue. It looks like it's trying to parse the SVG as JS which throws the error you've provided.
Could you provide a minimal test case?
from svg-spritemap-webpack-plugin.
I've just included the plugin in the webpack config file like this and ran the command webpack -p
module.exports.plugins = (module.exports.plugins || []).concat([
new SVGSpritemapPlugin({
src: './assets/**/*.svg',
prefix: 'icon-',
}),
])
When i do the webpack --watch
command it creates the spritemap.svg
file.
from svg-spritemap-webpack-plugin.
Could you provide the entire webpack configuration in this issue or (even better) a link to the project so I can test this? I suspect something goes wrong with production-specific loader configuration but I'm not sure as I don't know anything about your setup.
from svg-spritemap-webpack-plugin.
I'm using now a workaroud to build the spritemap file first in the development process and exclude later the plugin in the production build but this feels wrong...
const path = require('path')
const webpack = require('webpack')
const SVGSpritemapPlugin = require('svg-spritemap-webpack-plugin')
const CopyWebpackPlugin = require('copy-webpack-plugin')
const UglifyEsPlugin = require('uglify-es-webpack-plugin')
process.env.BABEL_ENV = 'app'
module.exports = {
entry: {
renderer: path.join(__dirname, 'app/main.js')
},
output: {
path: path.resolve(__dirname, './app-dist'),
libraryTarget: 'commonjs2',
filename: 'build.js'
},
resolve: {
extensions: ['.js', '.vue', '.scss'],
alias: {
vue: 'vue/dist/vue.js'
}
},
target: 'electron-renderer',
module: {
rules: [
{
test: /\.vue$/,
loader: 'vue-loader',
options: {
loaders: {
'scss': 'vue-style-loader!css-loader!sass-loader',
'sass': 'vue-style-loader!css-loader!sass-loader?indentedSyntax',
'js': 'babel-loader!eslint-loader'
},
},
include: [
path.resolve(__dirname, "app/"),
],
},
{
test: /\.js$/,
loaders: [
'babel-loader',
'eslint-loader',
],
include: [
path.resolve(__dirname, "app/"),
],
},
]
},
plugins: [
new webpack.NoEmitOnErrorsPlugin(),
new webpack.DefinePlugin({
'process.env.LATER_COV': false,
}),
new CopyWebpackPlugin([
{from: 'app/index.html'},
{from: 'node_modules/terminal-notifier/terminal-notifier.app/Contents/MacOS/terminal-notifier'},
], {}),
],
node: {
__filename: true,
__dirname: true
}
}
if (process.env.NODE_ENV === 'developemnt') {
module.exports.plugins = (module.exports.plugins || []).concat([
new SVGSpritemapPlugin({
src: './assets/**/*.svg',
prefix: 'icon-',
}),
])
}
if (process.env.NODE_ENV === 'production') {
module.exports.devtool = 'source-map'
module.exports.plugins = (module.exports.plugins || []).concat([
new UglifyEsPlugin(),
])
}
from svg-spritemap-webpack-plugin.
Does excluding the spritemap.svg
using the exclude
option from uglifyjs-webpack-plugin
not work?
from svg-spritemap-webpack-plugin.
Not tried it yet but shouldn't that be a problem because the uglifyjs tries to uglify only js files? (default test
option)
from svg-spritemap-webpack-plugin.
Yeah, I noticed the test
option too. I'm willing to look into the issue regarding the fact that it tries to minify a file that doesn't pass the test
but I'm short on time for the upcoming weeks so I'm looking for a solution to your problem in the meantime.
from svg-spritemap-webpack-plugin.
Cool thanks. Helps me a lot and thanks also for the great plugin!
from svg-spritemap-webpack-plugin.
You're more than welcome! I'll keep the issue open so I don't forget to look into this when I have the time.
from svg-spritemap-webpack-plugin.
I've been looking into this for the last hour but can't really replicate the issue. When someone runs into this problem and can submit a working test case I'd be happy to look into it once more.
from svg-spritemap-webpack-plugin.
Related Issues (20)
- <symbol> id is mangled by SVGO but not the css url anchor #fragment HOT 4
- contenthash not replacing on watch HOT 7
- Question, how generate json file with all file names HOT 3
- Provide option to add custom attributes to SVG element. HOT 2
- Cannot disable individual SVGO plugins. HOT 3
- Module not found: Error: Can't resolve './spritemap.svg' in src HOT 5
- SVG's not scaling with Webpack 5 HOT 7
- Google chrome ignoring <mask> HOT 4
- Glob doesn't find anything on windows HOT 5
- webpack dev server support HOT 8
- Generated SVG is not added to spritemap chunk HOT 7
- version 4.4.1 not compiling HOT 10
- Windows pattern HOT 4
- Rebuilds every time editing js files in watch mode. HOT 4
- Problem with path.join on windows HOT 2
- (node:19636) UnhandledPromiseRejectionWarning: TypeError: Cannot read property 'trim' of undefined HOT 1
- 404 Error when `options.output` changed
- Preserve svg with styles attribute HOT 7
- Empty output file when the style attribute contains either "visibility: hidden" or "display: none" HOT 3
- Add `mask` support HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from svg-spritemap-webpack-plugin.