账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    webpack dev server如何访问图片
    25
    0

    将源码放在src文件夹下,其中css中有引用同是src目录下的图片,是通过相对路径引用,通过npm run dev之后启动webpack dev server,之后访问的图片路径就变成了localhost:8080/img/pic1.jpg,因为没有把图片放在服务器上,因此访问不到,想请问一下应该如何设置?谢谢了

    3
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 在webpack中,你可以通过配置Webpack的图片处理插件来访问图片。以下是一个基本的配置示例:

      javascript module.exports = { entry: './src/index.js', output: { filename: 'bundle.js', path: path.resolve(__dirname, 'dist'), }, module: { rules: [ { test: /\.css$/, use: [ { loader: 'style-loader', }, ], }, { test: /\.(png|jpg|gif)$/, use: [ { loader: 'file-loader', }, ], }, ], }, plugins: [ new webpack.optimize.UglifyJsPlugin(), new webpack.optimize.OccurrenceOrderPlugin(), new webpack.DefinePlugin({ 'process.env.NODE_ENV': JSON.stringify('production'), }), ], };

      在这个配置中,我们首先定义了一个入口点(entry),然后定义了一个输出路径(output)。我们还定义了一个模块规则,用于处理CSS和图像文件。

      对于CSS文件,我们使用了style-loader来处理CSS代码。

      对于图像文件,我们使用了file-loader来处理图像文件。

      我们还定义了一个插件,用于处理打包时的环境变量。

      注意,你需要将'process.env.NODE_ENV'替换为你想要设置的环境变量的值。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部