import css如果css中一旦有url图片或字体，运行会报错，显示This relative module was not found（模块无法找到）。

[saymy]

通过vue init airyland/vux2 projectPath 类似的方式初始化一个项目。 如果项目中import css，一旦css文件中的background有url图片，或引用字体文件，运行npm run dev，会报如下错误：

This relative module was not found:

• ./image/logo.png in ./node_modules/css-loader?{"sourceMap":false}!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"dat a-v-04c2046b","scoped":false,"hasInlineConfig":false}!./node_modules/vux-loader/src/after-less-loader.js!./node_modules/less-loader?{" sourceMap":false}!./node_modules/vux-loader/src/style-loader.js!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./src/Ap p.vue

css文件中引用图片路径是相对路径，vue文件引用css文件也是相对路径。

经过调式发现，css文件中引用图片路径的相对路径，如果调整为图片相对于vue文件的相对路径，就能运行成功。但这样引用，这个css不能作为公用，只能是某一个vue进行引用。感觉十分地不方便。

另外，单独用vue-cli初始化项目，进行这样的css引用，不会出现这种错误，现象。

不知道是什么原因导致的？之前webpack2的版本也不会出现这种错误。

我的系统为windows 10, node v8.4.0, npm v5.3.0

[airyland]

请上重现代码或者建一个 repo.

[saymy]

步骤如下：

1. vue init airyland/vux2 projectPath
2. cd projectPath
3. npm install --registry=https://registry.npm.taobao.org
4. src下新建目录结构如下：

∨ index
    ∨ css
        ∨ image
           logo.png
        temp.css

 temp.css内容：

.temp{ width:200px; height: 200px; background: url("./image/logo.png") no-repeat; }

5. App.vue 文件增加引用：

@import './index/css/temp.css';

6. npm run dev 即报错：

This relative module was not found: ./image/logo.png in ./node_modules/css-loader?{"sourceMap":false}!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"dat a-v-04c2046b","scoped":false,"hasInlineConfig":false}!./node_modules/vux-loader/src/after-less-loader.js!./node_modules/less-loader?{" sourceMap":false}!./node_modules/vux-loader/src/style-loader.js!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./src/Ap p.vue

[airyland]

import 应该会从当前文件寻址，不要直接使用 import 而是引用，试试这样

<style src="./index/css/temp.css"></style>

[saymy]

嗯嗯，这样解决了！谢谢