Comments (6)
{ test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "file-loader?name=/fonts/[name]-[sha512:hash:base64:7].[ext]" },
@EyePulp try removing svg
from the regex and let me know if is still breaks.
from vue-svg-loader.
@visualfanatic that was it - sorry for the dumb mistake!
from vue-svg-loader.
I have the same issue.. with a very similar setup
from vue-svg-loader.
Please try updating to v0.2, let me know if that problem still occurs.
from vue-svg-loader.
Seems to be working now. Thanks
from vue-svg-loader.
I'm getting a near identical issue with a near identical setup. Running v0.2 of this package with Vue 2.5.2, getting this error:
error in ./assets/img/claim.svg
Module build failed:
@ ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./src/views/components/widgets/CAPLinks.vue 20:0-45
@ ./src/views/components/widgets/CAPLinks.vue
@ ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./src/views/components/AP/AP.vue
@ ./src/views/components/AP/AP.vue
@ ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./src/views/HomeView.vue
@ ./src/views/HomeView.vue
@ ./src/router/index.js
@ ./src/app.js
@ ./src/entry-server.js
example assets/img/claim.svg
I'm testing with:
<svg height="100" width="100">
<circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" />
</svg>
webpack config:
module: {
rules: [{
test : /\.vue$/,
loader : 'vue-loader',
options : vueConfig
}, {
test : /\.js$/,
loader : path.join(app_path, 'node_modules','babel-loader'),
exclude : /node_modules/
}, {
test: /\.(png|jpg|gif|ico)$/,
loader: 'url-loader',
options: {
limit: 8000,
// name: '[name]-[sha512:hash:base64:7].[ext]'
name: (isProd?'/':'') + '[name]-[sha512:hash:base64:7].[ext]'
}
},{
test: /img\/.*\.svg$/,
loader: 'vue-svg-loader', // `vue-svg` for webpack 1.x
},
// the url-loader uses DataUrls.
// the file-loader emits files.
{ test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: `url-loader?limit=8000&mimetype=application/font-woff&name=${isProd?'/':''}fonts/[name]-[sha512:hash:base64:7].[ext]` },
{ test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "file-loader?name=/fonts/[name]-[sha512:hash:base64:7].[ext]" },
{
test: /\.css$/,
use: isProd ? ExtractTextPlugin.extract({
use : 'css-loader?minimize',
fallback : 'vue-style-loader'
}) : ['vue-style-loader', 'css-loader']
}
]
},
I've tried other .svg
files as well, will be happy to try any fixes. Thanks!
from vue-svg-loader.
Related Issues (20)
- svgo options not working in webpack config
- [Question] Some objects in the SVG are being removed HOT 4
- Please create a new version to support svgo 2.x HOT 7
- SVG is missing parent's data-v attribute?
- Component is missing template or render function. HOT 1
- Syntax error on build HOT 4
- Relative module not found! HOT 4
- Module not found: Error: Can't resolve 'vue-loader-v16' HOT 1
- Security vulnerability - nth-check dependency HOT 1
- Syntax Error: NonErrorEmittedError: (Emitted value instead of an instance of Error) Error in parsing SVG: Non-whitespace before first tag. HOT 1
- Nuxt 3 support HOT 9
- Vuecli 5.x support HOT 7
- Loading svgs from different packages
- vue3 error HOT 5
- Is this project still being maintained? HOT 5
- Vue packages version mismatch
- nuxt3 can use? HOT 1
- [Vue warn]: Error in nextTick: "InvalidCharacterError: Failed to execute 'createElement' on 'Document' HOT 1
- Allow loading SVG images from HTML without breaking the current syntax (Nuxt) HOT 2
- Mark the component as Raw or use shallowRef
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 vue-svg-loader.