--- /dev/null
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="UTF-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+ <meta http-equiv="X-UA-Compatible" content="ie=edge" />
+ <title>Vue Router Examples - Encoding</title>
+ <!-- TODO: replace with local imports for promises and anything else needed -->
+ <script src="https://polyfill.io/v3/polyfill.min.js?features=default%2Ces2015"></script>
+ </head>
+ <body>
+ <div id="app">
+ <section class="info">
+ Name:
+ <pre id="name">{{ $route.name }}</pre>
+ </section>
+
+ <section class="info">
+ Params:
+ <pre id="params">{{ $route.params }}</pre>
+ </section>
+
+ <section class="info">
+ Query:
+ <pre id="query">{{ $route.query }}</pre>
+ </section>
+
+ <section class="info">
+ Hash:
+ <pre id="hash">{{ $route.hash }}</pre>
+ </section>
+
+ <section class="info">
+ FullPath:
+ <pre id="fullPath">{{ $route.fullPath }}</pre>
+ </section>
+
+ <section class="info">
+ path:
+ <pre id="path">{{ $route.path }}</pre>
+ </section>
+
+ <hr />
+
+ <ul>
+ <li>
+ <router-link to="/">/</router-link>
+ </li>
+ <li>
+ <!-- <router-link to="/n/€">/n/€</!-->
+ -->
+ </li>
+ <li>
+ <router-link to="/documents/%E2%82%AC"
+ >/documents/%E2%82%AC</router-link
+ >
+ </li>
+ <li>
+ <router-link :to="{ name: 'docs', params: { id: '€uro' }}"
+ >/documents/€uro (object)</router-link
+ >
+ </li>
+ <li>
+ <router-link
+ :to="{ name: 'home', query: { currency: '€uro', 'é': 'e' }}"
+ >/currency=€uro&é=e (object)</router-link
+ >
+ </li>
+ <li>
+ <a href="/n/%E2%82%AC">/n/%E2%82%AC (force reload)</a>
+ </li>
+ <li>
+ <a href="/n/€">/n/€ (force reload): not valid tho</a>
+ </li>
+ </ul>
+
+ <router-view></router-view>
+ </div>
+ </body>
+</html>
--- /dev/null
+import { Router, plugin, createHistory } from '../../src'
+import { RouteComponent } from '../../src/types'
+import Vue from 'vue'
+
+const component: RouteComponent = {
+ template: `<div>A component</div>`,
+}
+
+const Home: RouteComponent = {
+ template: `<div>Home</div>`,
+}
+
+const Document: RouteComponent = {
+ template: `<div>Document: {{ $route.params.id }}</div>`,
+}
+
+console.log('/' + __dirname)
+
+const router = new Router({
+ history: createHistory('/' + __dirname),
+ routes: [
+ { path: '/', component: Home, name: 'home' },
+ { path: '/documents/:id', name: 'docs', component: Document },
+ { path: encodeURI('/n/€'), name: 'euro', component },
+ ],
+})
+
+// use the router
+Vue.use(plugin)
+
+// @ts-ignore
+window.vm = new Vue({
+ el: '#app',
+ // @ts-ignore
+ router,
+})
--- /dev/null
+{
+ "include": ["*/*ts"],
+ "compilerOptions": {
+ "target": "es5",
+ "module": "commonjs",
+ // "lib": ["es2017.object"] /* Specify library files to be included in the compilation. */,
+ "declaration": true,
+ // "declarationMap": true,
+ "sourceMap": true,
+ "outDir": "./dist",
+ "removeComments": false,
+ "noEmit": false,
+
+ "strict": true,
+
+ "noUnusedLocals": true,
+ // "noUnusedParameters": true,
+ "noImplicitReturns": true,
+
+ "moduleResolution": "node",
+ "esModuleInterop": true
+ }
+}
--- /dev/null
+const fs = require('fs')
+const { resolve, join } = require('path')
+const HtmlWebpackPlugin = require('html-webpack-plugin')
+const webpack = require('webpack')
+
+const outputPath = resolve(__dirname, '__build__')
+
+module.exports = {
+ // Expose __dirname to allow automatically setting basename.
+ context: __dirname,
+ node: {
+ __dirname: true,
+ },
+
+ mode: process.env.NODE_ENV || 'development',
+
+ // devtool: 'inline-source-map',
+ devServer: {
+ // contentBase: outputPath,
+ historyApiFallback: {
+ rewrites: [{ from: /^\/encoding(?:\/?|\/.*)$/, to: '/encoding.html' }],
+ },
+ // hot: true,
+ },
+
+ entry: {
+ encoding: resolve(__dirname, 'encoding/index.ts'),
+ },
+ // entry: fs.readdirSync(__dirname).reduce((entries, dir) => {
+ // const fullDir = path.join(__dirname, dir)
+ // const entry = path.join(fullDir, 'index.ts')
+ // if (fs.statSync(fullDir).isDirectory() && fs.existsSync(entry)) {
+ // entries[dir] = ['es6-promise/auto', entry]
+ // }
+
+ // return entries
+ // }, {}),
+
+ output: {
+ path: join(__dirname, '__build__'),
+ filename: '[name].js',
+ chunkFilename: '[id].chunk.js',
+ publicPath: '/',
+ },
+
+ module: {
+ rules: [
+ {
+ test: /\.ts$/,
+ use: 'ts-loader',
+ },
+ ],
+ },
+ resolve: {
+ alias: {
+ vue: resolve(__dirname, '../node_modules/vue/dist/vue.esm.js'),
+ 'vue-router': join(__dirname, '..', 'src'),
+ },
+ // Add `.ts` and `.tsx` as a resolvable extension.
+ extensions: ['.ts', '.tsx', '.js'],
+ },
+ plugins: [
+ new HtmlWebpackPlugin({
+ // inject: false,
+ // chunks: ['encoding'],
+ filename: 'encoding.html',
+ title: 'Vue Router Examples - encoding',
+ template: resolve(__dirname, 'encoding/index.html'),
+ }),
+ new webpack.DefinePlugin({
+ 'process.env': {
+ NODE_ENV: JSON.stringify(process.env.NODE_ENV),
+ },
+ }),
+ ],
+}
projects / thirdparty / vuejs / router.git / commitdiff
