极客观点
项目管理
HarmonyOS
注意：我们是否可以在不使用任何代码编译器的情况下编写 vue.js 大型应用程序，就像目前我看到的所有示例现在都使用 webpack 来使 vue.js 代码与浏览器兼容。
我想要制作 vue.js 没有 webpack 并且不使用 .vue 扩展名的应用程序。可能吗？如果可能的话，您能否提供一个链接或提供在这种情况下如何使用路由的示例。
当我们在 .vue 扩展可以在 .js 扩展和使用应用程序，就像我们在角度 1 中所做的那样，我们可以制作整个应用程序而无需任何反式编译器来转换代码.
可以只在 html 、 css 、 js 文件中完成，没有 webpack 之类的东西。
我做了什么 。 索引.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 这个文件是在 webpack 加载的时候加入的
// 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 来编译代码吗？就像我们在 angular 1 中所做的那样。
谢谢
原文由 Himanshu sharma 发布，翻译遵循 CC BY-SA 4.0 许可协议
正如 jsFiddle 中所述：http: //jsfiddle.net/posva/wtpuevc6/ ，您没有义务使用 webpack 或 .vue 文件。
下面的代码不是我写的，所有的功劳都归功于这个 jsFiddle 的创建者：
创建一个 index.html 文件：
首页.js
Foo.js
路由器.js
索引.js
欣赏框架…
只是一个旁注：
.vue文件真的很棒，如果不需要使用它们，你一定要尝试它们