CODEWITHSUNDEEP
phpvue.js
Pensée Absurde
Pensée Absurde

Reputation: 1345

How to integrate php code in a vuejs project for production building?

Using CLI to generate a project with

vue create project

How can i integrate php code in .Vue files and not break the building command :

npm run build

As an example i want to add <?php ?> code inside the famous Home.vue view like so :

<template>
  <div class="home">
    <img alt="Vue logo" src="../assets/logo.png">
    <HelloWorld msg="Welcome to Your Vue.js App"/>
    <?php echo("this break the building"); ?>

  </div>
</template>

<script>
// @ is an alias to /src
import HelloWorld from "@/components/HelloWorld.php";

export default {
  name: "home",
  components: {
    HelloWorld
  }
};
</script>

Changing Home.vue to Home.php dont solve the problem.

Upvotes: 3

Views: 8103

Answers (1)

kalenpw
kalenpw

Reputation: 695

You can't.

VueCLI generates a static project of simply html and javascript. When you run npm run build if you look in your /dist folder you'll see only .html and .js files.

If you would like to use data from PHP in a Vue app you would need to add your Vue components to a PHP project and pass data to Vue as props.

Alternatively, a very common approach is to have a separate Vuejs frontend which consumes an API which you could write in PHP.

Upvotes: 6

Related Questions