问题标签 [vue-loader]

我刚刚开始了一个新的小项目，用于学习目的，我想尝试使用 Django（使用 DRF）的 Vue js。我正在尝试使用 vue 加载器（webpack-simple 模板）。

问题是我不知道如何同步npm run dev和python manage.py runserver. 我不知道如何访问 django 在 webpack-dev-server 中呈现的模板。

我的意思是我有一个带有 django-template 特定关键字的模板{% load static %}，显然 webpack-dev-server 没有处理这种关键字。

我知道我每次都可以构建它npm run build，但是每次我想做一些改变时都等待它有点烦人和无聊。

在 webpack 中，它被指定在默认index.html文件上运行，我怎样才能让它在实际呈现在 127.0.0.1:8000 上运行的模板上python manage.py runserver运行？我知道运行 2 个开发服务器没有任何意义，但我不知道如何以其他方式解释。

有替代方案吗？

提前感谢您的回答！

我有一个使用webpack 2的vue 2项目。我放弃了一段时间，然后返回发现几个我认为可能与旧版本有关的错误，所以我升级到webpack 3，并更新了vue-loader。

Syntax Error: Unexpected token {现在，每次尝试将组件导入 js 文件时，我似乎都会遇到错误。

例如：

从 main.js 文件给了我错误。从另一个 vue 组件中导入一个组件似乎不会给我带来任何问题。

这也是我在 main.js 中初始化应用程序的方式。所有这些以前都有效。

new Vue({ router: router, store, el: '#app', render: h => h(App) })

我不确定这是否是 vue-loader 或 webpack 配置或两者结合的问题。

这是我的 package.json 版本： "vue": "^2.5.2", "vue-resource": "^1.3.4", "vue-router": "^2.8.1", "vuex": "^2.2.1", "webpack": "^3.8.1", "webpack-bundle-analyzer": "^2.2.1", "webpack-dev-middleware": "^1.12.0", "webpack-hot-middleware": "^2.20.0", "webpack-merge": "^2.6.1", "babel-core": "^6.26.0", "babel-loader": "^7.1.2", "babel-plugin-istanbul": "^3.1.2", "babel-plugin-lodash": "^3.2.11", "babel-plugin-transform-runtime": "^6.22.0", "babel-preset-env": "^1.6.1", "babel-preset-stage-2": "^6.22.0", "babel-register": "^6.22.0",

我真的不知道该怎么做。我发誓我研究了很多

此代码返回 null

我正在将 vue-loader 用于应用程序。我想尽可能地解耦我的组件，并且有一种情况我想要这样的组件：

测试.vue

请注意以下行

孩子.vue

在我的应用程序上运行“webpack”会导致以下错误：

./~/babel-loader/lib!./~/vue-loader/lib/selector.js?type=script&index=0!./src/CompanyName.Module/Views/Test/test.vue 中的错误模块未找到: 错误：无法解析“文件”或“目录”C:\Users\user1\Documents\Visual Studio 2015\Projects\CompanyName.Web.ClientSide\CompanyName.Module.Website\Scripts\src\CompanyName.Module\Views\TestCompanyName /Components/child.vue 在 C:\Users\user1\Documents\Visual Studio 2015\Projects\CompanyName.Web.ClientSide\CompanyName.Module.Website\Scripts\src\CompanyName.Module\Views\Test @ ./~/ babel-loader/lib!./~/vue-loader/lib/selector.js?type=script&index=0!./src/CompanyName.Module/Views/Test/test.vue 23:16-70

似乎 vue-loader 没有将“./”识别为我的应用程序的基本路径（即“src”）。我想让我的所有引用都从同一个文件夹开始，以便我在启动时定义它们，并可能添加别名。 有没有办法配置 webpack.config 以便在遇到使用 require() 注入的依赖项时识别 './' 表示 '/src' ？

这曾经在过去使用 require.js 时被处理过

我的 Webpack.config

我已经看过了，我没有找到。我有一个来自外部 js 文件的 url，我正在我的 index.html 中导入。应用程序启动时正在加载文件。

但是，用户不会经常使用这些功能；而且我只想在调用特定组件时上传此文件。

我正在使用带有模板 webpack 的 vue cli (vue 2)。

我试过类似的东西：

他们不工作。

需要上传此文件才能使用支付网关。有谁能够帮我？

在构建我的项目时出现以下错误。实际上错误说“缺少绑定/myproject/node_modules/node-sass/vendor/linux-x64-57/binding.node”，但我有“缺少绑定/myproject/node_modules/node-sass/vendor/linux-x64-48 /绑定.节点”。我不知道为什么它没有引用“linux-x64-48”？

错误说 Run npm rebuild node-sass --force，我这样做了，但没有运气。请帮我解决这个问题。

节点版本：v8.9.1

npm：5.5.1

注意：我什至尝试删除整个 node_modules 并重新安装（npm install）它。但仍然得到同样的错误。

我正在使用 webpack 构建我的 vue.js 应用程序，一切都很好，直到在导入的 node_module css 文件中找到图像。它们无法解决。

在 vue.less 中

无法解决'./my_image.png'

添加url=false到vue-loader是一个选项

但它破坏了 ExtractTextPlugin ......

我如何告诉 vue-loader 在正确的文件夹中查找？或者，我如何告诉 webpack，请不要尝试将图像路径解析为模块？

如果我导入位于项目目录之外的过滤器文件（将它们注册到import Vue; Vue.filter(...)我得到错误Failed to resolve filter.

如果我将文件的副本保存在应用程序的文件夹中并从那里导入，过滤器将起作用，但是......我不想要同一个文件的副本。应用程序/构建是使用 Webpack Vue-CLI 创建的。不知道如何解决这个问题。我知道这不是 webpack build/dev 所期望的结构，但我很困惑为什么文件的位置会影响代码的运行方式。

\utils\filters.js

\apps\my-app\my-component.vue（使用 Vue webpack CLI 构建）

是否有可能因为从不同的地方filters.js导入Vue它正在导入不同版本的 Vue？还是有另一种方法来注册可用于解决此问题的过滤器？

我有一个使用带有 webpack-simple 模板的 Vue CLI 的项目。我正在引入一个我正在开发的提供 sass 文件的 NPM 包。一些 sass 文件具有 NPM 项目中图像的 url。这是 NPM 包中的样式示例。

该图像icon-close-blue.svg位于相对于 SCSS 文件的 NPM 包中。

我像这样将scss文件拉到我的项目中

当我用纱线启动开发服务器时，我得到了这个错误。

这是我的 webpack 配置

我能做些什么来让 webpack 处理这些图像路径吗？

我正在开发基于 vue-cli webpack 模板的单页应用程序。由于我们也必须使用静态资产，因此我们需要在样式表中引用它们。

官方文档建议使用绝对路径，如下所示：

问题是，vue-loader 和 webpack 本身不会处理静态资源，因此最终输出样式表中的 url 不会正确设置。webpack url-loader 将处理的所有资产都将根据您的 publicPath 配置获得正确的相对 url。静态资产也需要相同的效果。

您知道如何将静态资产与基于 vue.js 的应用程序结合使用吗？

更新

经过研究和大量试验和错误后，我决定将最终样式表和脚本包放在 index.html 旁边的根文件夹中。生成的路径将正常工作。不是最佳解决方案，因为我更喜欢脚本和样式表的子文件夹（尽管它们只包含一个文件）。但尽管如此，我有一个生成一致且有效的工件的构建过程。