hookehuyr

🎉 init: 初始化运行环境

1 +VITE_BASE_URL = '/'
...\ No newline at end of file ...\ No newline at end of file
1 +VITE_BASE_URL = '/rhyme/'
...\ No newline at end of file ...\ No newline at end of file
1 +node_modules
2 +.DS_Store
3 +dist
4 +dist-ssr
5 +*.local
6 +.history
7 +doc
...\ No newline at end of file ...\ No newline at end of file
1 +{
2 + "esversion": 11,
3 + "asi": true
4 +}
...\ No newline at end of file ...\ No newline at end of file
1 +<!DOCTYPE html>
2 +<html lang="en">
3 +<head>
4 + <meta charset="UTF-8">
5 + <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover" />
6 + <title></title>
7 +</head>
8 +<body>
9 + <div id="app"></div>
10 + <script type="module" src="/src/main.js"></script>
11 +</body>
12 +</html>
1 +{
2 + "name": "vant4-template",
3 + "version": "1.0.0",
4 + "scripts": {
5 + "dev": "vite",
6 + "start": "vite --host 0.0.0.0",
7 + "build": "vite build",
8 + "build-ts": "vue-tsc --noEmit && vite build",
9 + "serve": "vite preview"
10 + },
11 + "dependencies": {
12 + "jquery": "^3.6.0",
13 + "lodash": "^4.17.21",
14 + "moment": "^2.29.1",
15 + "vant": "^4.0.0-alpha.0",
16 + "vue": "^3.2.31"
17 + },
18 + "devDependencies": {
19 + "@types/jquery": "^3.5.14",
20 + "@vitejs/plugin-vue": "^2.2.4",
21 + "@vue/compiler-sfc": "^3.2.31",
22 + "axios": "^0.26.1",
23 + "less": "^4.1.2",
24 + "pinia": "^2.0.12",
25 + "postcss-px-to-viewport": "^1.1.1",
26 + "qs": "^6.10.3",
27 + "tslint": "^6.1.3",
28 + "vite": "^2.8.6",
29 + "vite-plugin-style-import": "1.4.1",
30 + "vue-router": "4"
31 + }
32 +}
1 +<template>
2 + <router-view></router-view>
3 +</template>
4 +
5 +<script setup>
6 +import axios from '@/utils/axios'
7 +import { useRoute, useRouter } from 'vue-router'
8 +import { Toast } from 'vant'
9 +import { mainStore } from './store';
10 +const store = mainStore();
11 +const $router = useRouter();
12 +
13 +</script>
14 +
15 +<style lang="less">
16 + html,body{
17 + width: 100%;
18 + height: 100%;
19 + }
20 +
21 + body {
22 + position: relative;
23 + /* --van-white: #fff;
24 + --van-blue: #1989fa;
25 + --van-button-primary-color: var(--van-white);
26 + --van-button-primary-background: var(--van-primary-color); */
27 + /* 全局修改主色调 */
28 + --van-blue: #3FC9E9;
29 +
30 + background-color: #FAFAFA;
31 + p {
32 + margin: 0;
33 + padding: 0;
34 + }
35 + }
36 +</style>
...\ No newline at end of file ...\ No newline at end of file
1 +export default {
2 + // 初始化设置
3 + init: {
4 + mounted () {
5 + document.title = this.$route.meta.title;
6 + }
7 + }
8 +};
...\ No newline at end of file ...\ No newline at end of file
1 +import { createApp } from 'vue';
2 +import { Button, Image as VanImage, Col, Row, Icon, Form, Field, CellGroup, ConfigProvider, Toast, Uploader, Empty, Tab, Tabs, Overlay, NumberKeyboard } from 'vant';
3 +import router from './router';
4 +import App from './App.vue';
5 +import axios from './utils/axios';
6 +import { createPinia } from 'pinia';
7 +
8 +const pinia = createPinia();
9 +const app = createApp(App);
10 +
11 +app.use(pinia);
12 +app.use(router);
13 +app.use(Button);
14 +app.use(VanImage);
15 +app.use(Col);
16 +app.use(Row);
17 +app.use(Icon);
18 +app.use(Form);
19 +app.use(Field);
20 +app.use(CellGroup);
21 +app.use(Toast);
22 +app.use(Uploader);
23 +app.use(Empty);
24 +app.use(Tab);
25 +app.use(Tabs);
26 +app.use(Overlay);
27 +app.use(NumberKeyboard);
28 +
29 +app.use(ConfigProvider);
30 +
31 +app.config.globalProperties.$http = axios; // 关键语句
32 +
33 +app.mount('#app');
1 +export default [{
2 + path: '/',
3 + name: '首页',
4 + component: () => import('./views/index.vue'),
5 + meta: {
6 + title: ''
7 + },
8 + children: []
9 +}];
...\ No newline at end of file ...\ No newline at end of file
1 +import { createRouter, createWebHashHistory } from 'vue-router';
2 +import routes from './route.js';
3 +
4 +// 创建路由实例并传递 `routes` 配置
5 +// 你可以在这里输入更多的配置,但我们在这里
6 +// 暂时保持简单
7 +const router = createRouter({
8 + history: createWebHashHistory('/index.html'),
9 + routes
10 +});
11 +
12 +export default router;
...\ No newline at end of file ...\ No newline at end of file
1 +import { defineStore } from 'pinia';
2 +
3 +export const mainStore = defineStore('main', {
4 + state: () => {
5 + return {
6 + msg: 'Hello world',
7 + count: 0,
8 + auth: false
9 + };
10 + },
11 + getters: {},
12 + actions: {
13 + changeState (state: boolean) {
14 + this.auth = state;
15 + }
16 + },
17 +});
...\ No newline at end of file ...\ No newline at end of file
1 +import axios from 'axios';
2 +import router from '../router';
3 +
4 +// 请求拦截器
5 +axios.interceptors.request.use(
6 + config => {
7 + // 发送请求前
8 + return config;
9 + },
10 + error => {
11 + // 请求错误处理
12 + return Promise.reject(error);
13 + });
14 +
15 +// 响应拦截器
16 +axios.interceptors.response.use(
17 + response => {
18 + if (response.data.code === 401) { // 未授权跳转登录页
19 + router.replace({
20 + path: '/auth'
21 + });
22 + }
23 + return response;
24 + },
25 + error => {
26 + return Promise.reject(error.response.data);
27 + });
28 +
29 +export default axios;
1 +import moment from 'moment';
2 +
3 +// 格式化时间
4 +const formatDate = (date) => {
5 + return moment(date).format('YYYY-MM-DD HH:mm');
6 +};
7 +// 判断是不是桌面微信
8 +const wxInfo = () => {
9 + let u = navigator.userAgent;
10 + let isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //android终端或者uc浏览器
11 + let isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
12 + let uAgent = navigator.userAgent.toLowerCase();
13 + let isTable = (uAgent.match(/MicroMessenger/i) == 'micromessenger') ? true : false;
14 + return {
15 + isAndroid,
16 + isiOS,
17 + isTable
18 + };
19 +};
20 +export { formatDate, wxInfo };
...\ No newline at end of file ...\ No newline at end of file
1 +<template>
2 + <div>vant template</div>
3 +</template>
4 +
5 +<script setup>
6 +
7 +</script>
8 +
9 +<script>
10 +import mixin from 'common/mixin'
11 +import { mainStore } from '@/store'
12 +import { storeToRefs } from 'pinia'
13 +
14 +export default {
15 + mixins: [mixin.init],
16 + data () {
17 + return {
18 +
19 + }
20 + },
21 + mounted () {
22 +
23 + },
24 + methods: {
25 +
26 + }
27 +}
28 +</script>
29 +
30 +<style lang="less" scoped>
31 +
32 +</style>
...\ No newline at end of file ...\ No newline at end of file
1 +{
2 + "compilerOptions": {
3 + "target": "esnext",
4 + "module": "esnext",
5 + "strict": true,
6 + "jsx": "preserve",
7 + "importHelpers": true,
8 + "moduleResolution": "node",
9 + "esModuleInterop": true,
10 + "allowSyntheticDefaultImports": true,
11 + "sourceMap": true,
12 + "isolatedModules": true,
13 + "baseUrl": ".",
14 + "allowJs": true,
15 + "types": [
16 + // "webpack-env",
17 + "vite/client"
18 + ],
19 + "paths": {
20 + "@/*": [
21 + "src/*"
22 + ]
23 + },
24 + "lib": [
25 + "esnext",
26 + "dom",
27 + "dom.iterable",
28 + "scripthost"
29 + ]
30 + },
31 + "include": [
32 + "src/**/*.ts",
33 + "src/**/*.tsx",
34 + "src/**/*.vue",
35 + "tests/**/*.ts",
36 + "tests/**/*.tsx"
37 +, "src/store/index.ts"],
38 + "exclude": [
39 + "node_modules"
40 + ]
41 +}
1 +{
2 + "defaultSeverity": "warning",
3 + "extends": [
4 + "tslint:recommended"
5 + ],
6 + "linterOptions": {
7 + "exclude": [
8 + "node_modules/**"
9 + ]
10 + },
11 + "rules": {
12 + "quotemark": [true, "single"],
13 + "indent": [true, "spaces", 2],
14 + "interface-name": false,
15 + "ordered-imports": false,
16 + "object-literal-sort-keys": false,
17 + "no-consecutive-blank-lines": false,
18 + "no-console": false
19 + }
20 +}
1 +import vue from '@vitejs/plugin-vue';
2 +import styleImport, { VantResolve } from 'vite-plugin-style-import';
3 +import { defineConfig } from 'vite';
4 +
5 +var path = require('path');
6 +
7 +export default({ command, mode }) => {
8 + let isProd = (command === 'serve'); // 情景配置是否为开发模式 serve 或 build
9 + return defineConfig({
10 + // root: '',
11 + base: isProd ? '/' : '/shzl/', // 开发或生产环境服务的公共基础路径。
12 + // mode: '', // 在配置中指明将会把 serve 和 build 时的模式 都 覆盖掉。也可以通过命令行 --mode 选项来重写。
13 + // define: '', // 定义全局常量替换方式。其中每项在开发环境下会被定义在全局,而在构建时被静态替换。
14 + plugins: [ // 将要用到的插件数组。Falsy 虚值的插件将被忽略,插件数组将被扁平化(flatten)。查看 插件 API 获取 Vite 插件的更多细节。
15 + vue(),
16 + styleImport({
17 + resolves: [VantResolve()],
18 + }),
19 + ],
20 + // publicDir: '', // 作为静态资源服务的文件夹。这个目录中的文件会在开发中被服务于 /,在开发模式时,会被拷贝到 outDir 的根目录,并没有转换,永远只是复制到这里。该值可以是文件系统的绝对路径,也可以是相对于项目的根目录路径。
21 + // cacheDir: '', // 存储缓存文件的目录。此目录下会存储预打包的依赖项或 vite 生成的某些缓存文件,使用缓存可以提高性能。如需重新生成缓存文件,你可以使用 --force 命令行选项或手动删除目录。此选项的值可以是文件的绝对路径,也可以是以项目根目录为基准的相对路径。
22 + resolve: {
23 + alias: { // 将会被传递到 @rollup/plugin-alias 作为 entries 的选项。也可以是一个对象,或一个 { find, replacement } 的数组. 当使用文件系统路径的别名时,请始终使用绝对路径。相对路径的别名值会被原封不动地使用,因此无法被正常解析。 更高级的自定义解析方法可以通过 插件 实现。
24 + "@": path.resolve(__dirname, "src"),
25 + "@components": path.resolve(__dirname, "src/components"),
26 + "@utils": path.resolve(__dirname, "src/utils"),
27 + "@images": path.resolve(__dirname, "src/assets/images"),
28 + "common": path.resolve(__dirname, "src/common"),
29 + },
30 + // dedupe: [''], // 如果你在你的应用程序中有相同依赖的副本(比如 monorepos),使用这个选项来强制 Vite 总是将列出的依赖关系解析到相同的副本(从项目根目录)。
31 + // conditions: [''], // 在解析包的 情景导出 时允许的附加条件。
32 + // mainFields: [''], // package.json 中,在解析包的入口点时尝试的字段列表。注意,这比从 exports 字段解析的情景导出优先级低:如果一个入口点从 exports 成功解析,主字段将被忽略。
33 + // extensions: [''], // 导入时想要省略的扩展名列表。注意,不 建议忽略自定义导入类型的扩展名(例如:.vue),因为它会干扰 IDE 和类型支持。
34 + },
35 + // css: {
36 + // modules: '', // 配置 CSS modules 的行为。选项将被传递给 postcss-modules。
37 + // postcss: '', // 内联的 PostCSS 配置(格式同 postcss.config.js),或者一个(默认基于项目根目录的)自定义的 PostCSS 配置路径。其路径搜索是通过 postcss-load-config 实现的。 注意,如果提供了该内联配置,Vite 将不会搜索其他 PostCSS 配置源。
38 + // preprocessorOptions: '', // 指定传递给 CSS 预处理器的选项。
39 + // },
40 + // json: {
41 + // namedExports: true, // 是否支持从 .json 文件中进行按名导入。
42 + // stringify: false, // 若设置为 true,导入的 JSON 会被转换为 export default JSON.parse("...") 会比转译成对象字面量性能更好,尤其是当 JSON 文件较大的时候。 开启此项,则会禁用按名导入。
43 + // },
44 + // esbuild: false, //
45 + // assetsInclude: '', // 指定其他文件类型作为静态资源处理
46 + logLevel: 'info', // 调整控制台输出的级别,默认为 'info'。
47 + // clearScreen: true, // 设为 false 可以避免 Vite 清屏而错过在终端中打印某些关键信息。命令行模式下请通过 --clearScreen false 设置。
48 + server: {
49 + host: '0.0.0.0',
50 + port: 8006, // 本地服务端口
51 + // strictPort: true, // 设为true时若端口已被占用则会直接退出, 而不是尝试下一个可用端口
52 + // https: '',
53 + // open: false, // 在服务器启动时自动在浏览器中打开应用程序. 当此值为字符串时, 会被当作URL的路径名.
54 + proxy: { // 代理
55 + '/srv/': {
56 + target: 'http://space-dev.onwall.cn',
57 + changeOrigin: true,
58 + // rewrite: (path) => path.replace(/^\/api/, '')
59 + },
60 + },
61 + // cors: '', // 为开发服务器配置 CORS。默认启用并允许任何源,传递一个 选项对象 来调整行为或设为 false 表示禁用。
62 + // force: '', // 设置为 true 强制使依赖预构建。
63 + // hmr: '', // 禁用或配置 HMR 连接(用于 HMR websocket 必须使用不同的 http 服务器地址的情况)。 设置 server.hmr.overlay 为 false 可以禁用服务器错误遮罩层。
64 + // watch: '', // 传递给 chokidar 的文件系统监视器选项。
65 + },
66 + build: {
67 + outDir: 'shzl', // 指定输出路径(相对于项目根目录).
68 + assetsDir: 'static',
69 + rollupOptions: {
70 + output: {
71 + chunkFileNames: 'static/js/[name]-[hash].js',
72 + entryFileNames: 'static/js/[name]-[hash].js',
73 + assetFileNames: 'static/[ext]/[name]-[hash].[ext]',
74 + },
75 + input: { // 多页面应用模式
76 + main: path.resolve(__dirname, 'index.html'),
77 + // shzl2022: path.resolve(__dirname, 'shzl2022.html'), // router需要配置入口
78 + }
79 + },
80 + },
81 + optimizeDeps: {
82 + // entries: '',
83 + // exclude: [],
84 + include: ['jquery', 'lodash', 'moment', 'axios', 'pinia', 'vue-router', 'vant'], // 默认情况下,不在 node_modules 中的,链接的包不会被预构建。使用此选项可强制预构建链接的包。
85 + // keepNames: false, // 打包器有时需要重命名符号以避免冲突。 设置此项为 true 可以在函数和类上保留 name 属性。 若想获取更多详情,请参阅 keepNames
86 + }
87 + });
88 +};
This diff is collapsed. Click to expand it.
This diff is collapsed. Click to expand it.