, Но, если проблема состоит в том, чтобы создать три отдельных файла для приложения Vue, вам понадобится система, которая сделает все за вас. В качестве примера вы можете использовать веб-пакет.
чание: Можем ли мы написать большое приложение vue.js без использования компилятора для кода, как в настоящее время, я вижу все примеры использования веб-пакета сейчас, чтобы сделать код vue.js совместимым для браузера.
Я хочу сделатьvue.js приложение безwebpack и без использования.vue расширение. Является ли это возможным? если это возможно, вы можете предоставить ссылку или привести пример использования маршрутизации в этом случае.
Как мы делаем компонент в.vue расширение можно сделать компонентом в.js Расширение и использование приложения, как мы делаем в angular 1, где мы можем создать целое приложение без транс-компилятора для преобразования кода.
Это можно сделать только в файлах html, css, js и без всяких веб-пакетов.
Что я сделал .index.js
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>vueapp01</title>
</head>
<body>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
main.js этот файл добавлен во время загрузки веб-пакета
// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import App from './App'
import router from './router'
Vue.config.productionTip = false
/* eslint-disable no-new */
new Vue({
el: '#app',
router,
components: { App },
template: '<App/>'
})
App.vue
<template>
<div id="app">
<img src="./assets/logo.png">
<a href="#/hello">Hello route</a>
<a href="#/">Helloworld route</a>
{{route}}
<router-view/>
<!-- <hello></hello> -->
</div>
</template>
<script>
export default {
name: 'App',
data () {
return {
route : "This is main page"
}
}
}
</script>
маршрутизатор
import Vue from 'vue'
import Router from 'vue-router'
import HelloWorld from '@/components/HelloWorld'
import Hello from '../components/Hello'
Vue.use(Router)
export default new Router({
routes: [
{
path: '/',
name: 'HelloWorld',
component: HelloWorld
},
{
path: '/hello',
name: 'Hello',
component: Hello
}
]
})
Я сделал что-то вроде этого. Можем ли мы сделать это, используя только html, css, js файл без webpack для компиляции кода. Как мы делаем в угловых 1.
Спасибо