相关疑难解决方法(0)

Vue.js数据绑定样式backgroundImage不起作用

我试图在一个元素中绑定图像的src,但它似乎不起作用.我得到一个"无效的表达式.生成的函数体:{backgroundImage:{url(image)}".

文件说要使用'烤肉串案例'或'驼峰案例'.

<div class="circular" v-bind:style="{ backgroundImage: { url(image) }"></div>

这是一个小提琴:https://jsfiddle.net/0dw9923f/2/

html javascript vue.js

59
推荐指数
6
解决办法
10万
查看次数

webpack css-loader无法在外部样式表中的url()引用中查找图像

我是整个Node/NPM/Webpack世界的新手,所以如果这很明显就道歉.

我正在尝试构建一个与Webpack捆绑在一起的简单前端项目.我已安装节点,并配置了package.json文件.如果我在我的根目录中运行"npm start",我从控制台得到没有错误,我可以在浏览器中转到"localhost:3000"并查看我的"hello,world"输出.

我的下一个任务是包含一个样式表,其中包含对图像的引用,如下所示:

.myimg {background: url(path/to/file.jpg);}

设置这样的东西,我可以通过webpack-dev-server查看图像(通过在Web浏览器中访问localhost:3000),但如果我构建项目,图像的路径是错误的.我不知道我做错了什么,所以我把它扔给了Stackiverse,希望那里的人会知道我在做什么愚蠢的事情.

这是我的package.json文件:

{
  "name": "webpack-test1",
  "version": "0.0.1",
  "description": "My project WTF.",
  "private": true,
  "scripts": {
    "start": "node server.js"
  },
  "devDependencies": {
   "css-loader": "^0.15.2",
   "file-loader": "^0.8.4",
   "style-loader": "^0.12.3",
   "url-loader": "^0.5.6"
  },
  "dependencies": {
    "webpack": "^1.9.6",
    "webpack-dev-server": "^1.8.2"
  }
}
Run Code Online (Sandbox Code Playgroud)

...这是我的webpack.config.js文件:

var path = require('path');
var webpack = require('webpack');

module.exports = {
  entry: [
    "./src/start.js"
],
output: {
    filename: "bundle.js",
    path: path.join(__dirname, 'build'),
    publicPath: '/build/'
},
module: {
    loaders: [
        { test: /\.css$/, loader: 'style-loader!css-loader' …
Run Code Online (Sandbox Code Playgroud)

node.js webpack webpack-style-loader

50
推荐指数
2
解决办法
4万
查看次数