webpack-dev-serve的路径问题

发布于 2022-09-04 18:35:00 字数 1384 浏览 11 评论 0

假如我的目录结构是这样:

src
 +css
 -js
   --entry1.js
   --test.json
 index.html

然后我以src为根目录,启动了webpack-dev-server本地服务器
config配置是这样的:

    entry: {
        index: ['../src/js/entry1.js']
    },
   output: {
        path: path.resolve(__dirname, '../dist'), //没用?
        publicPath: '/assets/',
        filename: 'js/[name].js'
    },

问题一:这里path: path.resolve(__dirname, '../dist')貌似完全没有用
打开localhost服务器地址,发现路径是以publickPath为基准,入口文件引入的entry1.js输出后的路径是:

localhost:8080/assets/js/index.js


问题二:webpack-dev-server本地服务器端的实际完整结构是?

然后我在entry1.js里get那个js文件夹下的json文件:

$.get('js/test.json', function(data) {
    console.log(data.msg);
});

然后发现test.json是在localhost:8080/js/test.json路径被加载的
也就是说src文件夹下的原本的内容也都被webpak-dev-server服务器保留了

那么webpack-dev-server服务器的实际目录结构是下面这样?

src(根目录,也就是localhost:8080)

/*在内存中输出后的内容*/
 -assets/js
  --index.js

/*原本有的内容*/
 +css
 -js
   --entry1.js
   --test.json
 index.html

但是打开localhost:8080页面只能看到如下结构:

src(根目录,也就是localhost:8080)

/*在内存中输出后的内容*/
 -assets/js
  --index.js
 index.html

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

无敌元气妹 2022-09-11 18:35:00

问题一:这里path: path.resolve(__dirname, '../dist')貌似完全没有用

dist文件夹放在哪里? 在SRC之外的话,SRC是根目录,自然找不到dist

应该在src上层目录执行

目录结构大概是这样子
--src
--dist
--webpack-dev-server.js

在这个层级,运行webpack-dev-server才能找到dist,
path: path.resolve(__dirname, "dist")

凑诗 2022-09-11 18:35:00

请问publicPath改了之后,如何实现CSS里面的背景图片的路径问题

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文