I would like advice on environment construction using the following.
When using vue files with Vue.js, we generally recognize that VueCLI builds the environment (we know that we can build the environment from scratch).
However, in any introductory article, I have never seen a pattern that would be used in combination with a server-side language when implementing VueCLI.
I wanted to know how to use PHP in combination with VueCLI when using PHP as a server-side language.
For example, when considering a directory structure with a combination of PHP and Slim framework, we are thinking as follows.
* The following Project is the root unit (one build unit) in NetBeans and Eclipse.
I want to check
Project | + src (PHP source) + public (public directory) + index.php + assets | + js + css + img
What kind of directory structure is better when VueCLI is used in combination with the above directory?
In the first place, is Project separate on the client (Vue.js) and server side (PHP)?
In a common sample, start the node.js web server, access 8080, and display the page there. Apache + PHP is used to check the operation during development. I want to use it. In such a case, is it possible to check the operation speedily by combining hot reloading (which can be confirmed immediately after editing the vm file)?
The front end has experienced Knockout.js, AngularJS, and Vue.JS (no use of vue files), but it has entered the area where Vue.js builds vue files. Since then, I feel that it has become very difficult.
In addition to the opinions of respondents, if you know information about books, sites, etc. that mention the combination of server side and VueCLI, please let me know.
Answer # 1
There are many SPA examples in the example of using VueJS, and it is common to serve HTML with node, but of course Vue should be used if HTML is served without using node. I can.
I am currently using Vue with HTML output on the Java side and Java on the server side.
Vue single file components (.vue) cannot be called from HTML as they are, so you need to compile them (webpack or browserify) into (.js) files. After that, if you call the output .js as in
<script src ="/dist/app.js"></script>It ’s good.
I think the project structure is as follows. (Transpiler assumes webpack)
Project | + src (PHP source) + vue (folder created with vueJS source VueCLI) + + main.js | + app.vue | + webpack.config.js | + package.json | + node_modules + public (public directory) + index.php + assets | + js + css + img + dist (Vue source compiled output destination specified in webpack.config.js) The output destination may be assets/js, but it is separated to distinguish
The output folder is specified in webpack.config.js, so you can change it there.
Learn how to use the webpack configuration file "webpack.config.js"-Change output folder and file name
I think that HotReload can be done if there is such a function in Slim, probably to specify the folder to be monitored ...
Unfortunately, I have no experience with Slim, so I don't know the details.
By the way, I'm using Java's SpringBoot framework and have HotReload functionality
Hot reloading is possible because the folder of the compilation result of the Vue source is the monitoring target.
- about environment construction of windows10 iis php74
- php environment construction, mamp login
- c ++ - about atcoder environment construction
- php method definition file
- unable to connect to postgres from php environment
- nodejs - react environment construction
- php - about checking method of data check in web application
- python 3x - construction of jupyter notebook environment on raspberry pi4
- i want to use the jupyter lab, a python environment construction on a mac
- vuejs i'm defining but i get an error "[vue warn]: property or method "email" is not defined on the instance but
- php - processing method when there are many existence checks of the value received by post
- php - [wordpress] efficient management method of the function used
- php got stuck in building a local environment
- about flutter environment construction
- php - in https environment, the path of css etc of wordpress site will be loaded as http
- vuejs - about info in vue environment storybook
- vuejs - property or method "currentuser" is not defined when authenticating a user in firestore
- php - i want to know the reason why method names cannot be grouped by laravel routing
- php - although i built a laravel development environment with docker, an error screen appears due to a db container connection e
- i want to run php with postfix
- php - if you change the site address on wordpress, it will redirect to other domains without permission
- php cannot be executed
- ubuntu+docker cannot create php environment
- i want to apply css to indexphp
- php - in ec-cube2132, "notice: undefined xxx" is displayed in various places on the site and it cannot be hidden
- php - cannot read external font (cross origin?)
- regarding timeout of php ~ postgresql
- php - site made with codeigniter and ajax is no longer displayed
- php - about error of imagick not found