Question

我试图从laravel项目中的app.js文件中注册一个vue组件，但是我似乎找不到app.js的正确路径，{{1}有两个文件1}}文件名。这是我的文件结构：

app.js

在这里我将app.js文件导入到刀片文件中：

public
        css
        js
               app.js

resources
        js
              components
                     Articles.vue
                     ExampleComponent.Vue
              app.js
              bootstrap.js

问题是我想访问<body> <div id="app"> <articles> </articles> </div> <script type="text/javascript" src="{{ assets('js/app.js') }}"></script> </body>文件夹中的第二个app.js文件，但是上面的代码一直在给我{{{ 1}}文件夹。

我尝试使用此代码resources为其提供文件的绝对路径
这给了我一个像app.js这样的URL，它是正确的文件位置，但是以某种方式，此链接导致了一个public页面。那么还有其他方法可以访问文件吗？

谢谢

Answer 1

首先

localhost:8000/something始终引用something目录中的public。因此，您无法在刀片文件中将resource/js/app.js引用为js文件。

第二

实际上，您不需要在刀片中使用resource/js/app.js文件。如果您这样做，代码将无法正常工作。因为resources/js/app.js中的代码是未编译的。您需要编译它们并在刀片文件中使用它们。那么，编译后的文件在哪里？它实际上是public/js/app.js文件。该文件是resource/js/app.js的编译版本。

问题是每次您在resource中更改js文件时，都需要重新编译js代码。所有这些代码将合并在一起并复制到public/js/app.js中。

如何编译？

在编译js代码之前，您需要通过运行npm install命令来确保正确安装了前端依赖项。

然后，如果安装了所有依赖项，则可以使用命令

编译代码

npm run dev用于开发级别的编译

npm run production编译（最小化和安全化）生产级别。

如果不想每次更改文件都运行npm run dev命令，则可以运行npm run watch命令。此命令将监视是否更改了任何js文件。如果更改，它将自动编译。

如何访问公用文件夹之外的js文件？

1 个答案: