blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-05 19:41:42 +08:00
Code Issues Projects Releases Wiki Activity

[Build] use vue-cli to build site (#3734)

Browse Source
This commit is contained in:
neverland 2019-07-03 12:58:39 +08:00 committed by GitHub
parent 53e9468c2c
commit 66459df72a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
30 changed files with 7776 additions and 1304 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
build/build-lib.js
View File

@ -12,8 +12,8 @@ const tasks = [
'node build/build-components.js --color',
'node build/build-style.js',
'node build/build-style-entry.js',
'cross-env NODE_ENV=production webpack --color --config build/webpack.build.js',
'cross-env NODE_ENV=production webpack -p --color --config build/webpack.build.js'
'cross-env NODE_ENV=production webpack --color --config build/webpack.config.js',
'cross-env NODE_ENV=production webpack -p --color --config build/webpack.config.js'
];
tasks.forEach(task => {

20
build/webpack.build.js → build/webpack.config.js
View File

@ -1,11 +1,8 @@
const path = require('path');
const config = require('./webpack.dev.js');
const isMinify = process.argv.indexOf('-p') !== -1;
delete config.serve;
module.exports = Object.assign(config, {
module.exports = {
mode: 'production',
entry: {
vant: './es/index.js'
@ -26,8 +23,19 @@ module.exports = Object.assign(config, {
amd: 'vue'
}
},
performance: false,
optimization: {
minimize: isMinify
},
resolve: {
extensions: ['.js', '.ts', '.tsx']
},
module: {
rules: [
{
test: /\.(js|ts|tsx)$/,
exclude: /node_modules/,
use: 'babel-loader'
}
]
}
});
};

91
build/webpack.dev.js
View File

@ -1,91 +0,0 @@
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const ProgressBarPlugin = require('progress-bar-webpack-plugin');
const { VueLoaderPlugin } = require('vue-loader');
module.exports = {
mode: 'development',
entry: {
'vant-docs': './docs/site/index.js',
'vant-mobile': './docs/site/mobile.js'
},
output: {
path: path.join(__dirname, '../docs/dist'),
publicPath: '/',
chunkFilename: 'async_[name].js'
},
stats: {
modules: false,
children: false
},
devServer: {
open: true,
host: '0.0.0.0',
stats: 'errors-only',
clientLogLevel: 'warning'
},
resolve: {
extensions: ['.js', '.ts', '.tsx', '.vue', '.css']
},
module: {
rules: [
{
test: /\.vue$/,
use: [
{
loader: 'vue-loader',
options: {
compilerOptions: {
preserveWhitespace: false
}
}
}
]
},
{
test: /\.(js|ts|tsx)$/,
exclude: /node_modules/,
use: 'babel-loader'
},
{
test: /\.less$/,
sideEffects: true,
use: [
'style-loader',
'css-loader',
'postcss-loader',
{
loader: 'less-loader',
options: {
paths: [path.resolve(__dirname, 'node_modules')]
}
}
]
},
{
test: /\.md$/,
use: ['vue-loader', '@vant/markdown-loader']
},
{
test: /\.(ttf|svg)$/,
loader: 'url-loader'
}
]
},
plugins: [
new VueLoaderPlugin(),
new ProgressBarPlugin(),
new HtmlWebpackPlugin({
chunks: ['vant-docs'],
template: 'docs/site/index.tpl',
filename: 'index.html',
inject: true
}),
new HtmlWebpackPlugin({
chunks: ['vant-mobile'],
template: 'docs/site/index.tpl',
filename: 'mobile.html',
inject: true
})
]
};

14
build/webpack.doc.js
View File

@ -1,14 +0,0 @@
const path = require('path');
const config = require('./webpack.dev.js');
delete config.serve;
module.exports = Object.assign(config, {
mode: 'production',
output: {
path: path.join(__dirname, '../docs/dist'),
publicPath: 'https://youzan.github.io/vant/',
filename: '[name].[hash:8].js',
chunkFilename: 'async_[name].[chunkhash:8].js'
}
});

166
docs/site/DocsApp.vue
View File

@ -1,166 +0,0 @@
<template>
<div class="app">
<van-doc
:base="base"
:config="config"
:lang="$vantLang"
:github="github"
:versions="versions"
:simulators="simulators"
:search-config="searchConfig"
:current-simulator="currentSimulator"
@switch-version="onSwitchVersion"
>
<router-view @changeDemoURL="onChangeDemoURL" />
</van-doc>
</div>
</template>
<script>
import pkgJson from '../../package.json';
import docConfig, { github, versions, searchConfig } from './doc.config';
export default {
data() {
this.github = github;
this.versions = versions;
this.searchConfig = searchConfig;
return {
simulators: [`mobile.html${location.hash}`],
demoURL: ''
};
},
computed: {
base() {
return `/${this.$vantLang}`;
},
config() {
return docConfig[this.$vantLang];
},
currentSimulator() {
const { name } = this.$route;
return name && name.indexOf('demo') !== -1 ? 1 : 0;
}
},
mounted() {
this.showVersionTip();
},
methods: {
showVersionTip() {
const tip = window.localStorage.getItem('vantVersionTip');
if (!tip && this.$vantLang === 'zh-CN') {
const version = document.querySelector('.van-doc-header__version');
version.insertAdjacentHTML('beforeend', `
<div class="doc-version-tip">
提示：你当前访问的是 Vant 2.0 版本文档，点此切换至旧版文档
<div style="text-align: right;">
<button class="doc-version-tip__button">好哒</button>
</div>
</div>
`);
const tip = document.querySelector('.doc-version-tip');
const removeTip = event => {
event.stopPropagation();
tip.parentNode.removeChild(tip);
};
tip.addEventListener('click', removeTip);
version.addEventListener('click', removeTip);
window.localStorage.setItem('vantVersionTip', 1);
}
},
onChangeDemoURL(url) {
this.simulators = [this.simulators[0], url];
},
onSwitchVersion(version) {
if (version !== pkgJson.version) {
location.href = `https://youzan.github.io/vant/${version}`;
}
}
}
};
</script>
<style lang="less">
.van-doc-intro {
padding-top: 20px;
font-family: 'Dosis', 'Source Sans Pro', 'Helvetica Neue', Arial, sans-serif;
text-align: center;
p {
margin-bottom: 20px;
}
}
.doc-version-tip {
position: absolute;
top: 35px;
left: 50%;
z-index: 100;
box-sizing: border-box;
width: 300px;
margin-left: -150px;
padding: 15px;
color: #333;
text-align: left;
background-color: #fff;
border-radius: 6px;
box-shadow: 0 4px 12px #ebedf0;
transform-origin: top;
cursor: default;
animation: version-tip .25s cubic-bezier(0.175, 0.885, 0.32, 1.375);
&::before {
position: absolute;
top: -4px;
left: 50%;
margin-left: -3px;
border: 6px solid;
border-color: transparent transparent white white;
transform: rotate(135deg);
content: '';
}
&__button {
width: 60px;
color: #fff;
font-size: 12px;
line-height: 24px;
background: #1889f9;
border: none;
border-radius: 15px;
cursor: pointer;
&:hover {
background: darken(#1889f9, 10%);
}
&:focus {
outline: none;
}
}
@keyframes version-tip {
from {
transform: scaleY(0);
opacity: 0;
}
to {
transform: scaleY(1);
opacity: 1;
}
}
}
</style>

18
docs/site/index.tpl
View File

@ -1,18 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover">
<meta http-Equiv="Cache-Control" Content="no-cache" />
<meta http-Equiv="Pragma" Content="no-cache" />
<meta http-Equiv="Expires" Content="0" />
<link rel="shortcut icon" href="https://img.yzcdn.cn/zanui/vant/vant-2017-12-18.ico">
<title>Vant - 轻量、可靠的移动端 Vue 组件库</title>
<script>window.Promise || document.write('<script src="//img.yzcdn.cn/huiyi/build/h5/js/pinkie.min.js"><\/script>');</script>
</head>
<body ontouchstart>
<div id="app"></div>
</body>
</html>

9
package.json
View File

@ -14,12 +14,12 @@
],
"scripts": {
"bootstrap": "yarn || npm i",
"dev": "npm run build:entry && webpack-dev-server --config build/webpack.dev.js",
"dev": "npm run build:entry && cd site && yarn serve",
"lint": "eslint ./src --ext .js,.vue,.ts,.tsx && stylelint \"src/**/*.less\" --fix",
"build:entry": "node build/build-entry.js",
"build:changelog": "vant-doc changelog ./docs/markdown/changelog.generated.md --tag 2.0.0",
"build:lib": "node build/build-lib.js",
"build:site": "rm -rf docs/dist && cross-env NODE_ENV=production webpack --config build/webpack.doc.js && gh-pages -d docs/dist --add",
"build:site": "rm -rf site/dist && cd site && npm run build && gh-pages -d dist --add",
"test": "jest",
"test:watch": "jest --watch",
"test:clear-cache": "jest --clearCache",
@ -89,7 +89,6 @@
"eslint": "^6.0.1",
"fast-glob": "^3.0.3",
"gh-pages": "^2.0.1",
"html-webpack-plugin": "3.2.0",
"husky": "^3.0.0",
"jest": "^24.8.0",
"jest-serializer-vue": "^2.0.2",
@ -98,7 +97,6 @@
"lint-staged": "^9.0.0",
"postcss": "^7.0.17",
"postcss-loader": "^3.0.0",
"progress-bar-webpack-plugin": "^1.12.1",
"shelljs": "^0.8.3",
"signale": "^1.4.0",
"style-loader": "^0.23.1",
@ -118,8 +116,7 @@
"vue-template-compiler": "2.6.10",
"vue-template-es2015-compiler": "^1.9.1",
"webpack": "4.35.2",
"webpack-cli": "^3.3.5",
"webpack-dev-server": "3.7.2"
"webpack-cli": "^3.3.5"
},
"sideEffects": [
"es/**/style/*",

3
site/babel.config.js Normal file
View File

@ -0,0 +1,3 @@
module.exports = {
presets: ['@vue/app']
};

26
site/package.json Normal file
View File

@ -0,0 +1,26 @@
{
"name": "@vant/site",
"version": "1.0.0",
"scripts": {
"serve": "vue-cli-service serve",
"build": "yarn && vue-cli-service build"
},
"dependencies": {
"core-js": "^2.6.5",
"register-service-worker": "^1.6.2"
},
"devDependencies": {
"@vue/cli-plugin-babel": "^3.1.1",
"@vue/cli-plugin-typescript": "^3.8.1",
"@vue/cli-service": "^3.1.4"
},
"postcss": {
"plugins": {
"autoprefixer": {}
}
},
"browserslist": [
"> 1%",
"last 2 versions"
]
}

14
site/public/index.html Normal file
View File

@ -0,0 +1,14 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover">
<link rel="shortcut icon" href="https://img.yzcdn.cn/zanui/vant/vant-2017-12-18.ico">
<title>Vant - 轻量、可靠的移动端 Vue 组件库</title>
</head>
<body ontouchstart>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>

0
docs/site/components/DemoList.vue → site/src/components/DemoList.vue
View File

0
docs/site/components/DemoPages.vue → site/src/components/DemoPages.vue
View File

0
docs/site/components/MobileNav.vue → site/src/components/MobileNav.vue
View File

74
site/src/desktop/App.vue Normal file
View File

@ -0,0 +1,74 @@
<template>
<div class="app">
<van-doc
:base="base"
:config="config"
:lang="$vantLang"
:github="github"
:versions="versions"
:simulators="simulators"
:search-config="searchConfig"
:current-simulator="currentSimulator"
@switch-version="onSwitchVersion"
>
<router-view @changeDemoURL="onChangeDemoURL" />
</van-doc>
</div>
</template>
<script>
import pkgJson from '../../package.json';
import docConfig, { github, versions, searchConfig } from '../doc.config';
export default {
data() {
this.github = github;
this.versions = versions;
this.searchConfig = searchConfig;
return {
simulators: [`mobile.html${location.hash}`],
demoURL: ''
};
},
computed: {
base() {
return `/${this.$vantLang}`;
},
config() {
return docConfig[this.$vantLang];
},
currentSimulator() {
const { name } = this.$route;
return name && name.indexOf('demo') !== -1 ? 1 : 0;
}
},
methods: {
onChangeDemoURL(url) {
this.simulators = [this.simulators[0], url];
},
onSwitchVersion(version) {
if (version !== pkgJson.version) {
location.href = `https://youzan.github.io/vant/${version}`;
}
}
}
};
</script>
<style lang="less">
.van-doc-intro {
padding-top: 20px;
font-family: 'Dosis', 'Source Sans Pro', 'Helvetica Neue', Arial, sans-serif;
text-align: center;
p {
margin-bottom: 20px;
}
}
</style>

11
docs/site/index.js → site/src/desktop/main.js
View File

@ -1,9 +1,10 @@
import Vue from 'vue';
import VueRouter from 'vue-router';
import VantDoc from '@vant/doc';
import App from './DocsApp';
import routes from './router';
import { isMobile, importAll } from './utils';
import routes from '../router';
import App from './App';
import { isMobile, importAll } from '../utils';
import '../sw';
if (isMobile) {
location.replace('mobile.html' + location.hash);
@ -12,8 +13,8 @@ if (isMobile) {
Vue.use(VueRouter).use(VantDoc);
const docs = {};
const docsFromMarkdown = require.context('../markdown', false, /(en-US|zh-CN)\.md$/);
const docsFromPackages = require.context('../../src', true, /README(\.zh-CN)?\.md$/);
const docsFromMarkdown = require.context('../../../docs/markdown', false, /(en-US|zh-CN)\.md$/);
const docsFromPackages = require.context('../../../src', true, /README(\.zh-CN)?\.md$/);
importAll(docs, docsFromMarkdown);
importAll(docs, docsFromPackages);

0
docs/site/doc.config.js → site/src/doc.config.js
View File

2
docs/site/WapApp.vue → site/src/mobile/App.vue
View File

@ -50,7 +50,7 @@ export default {
</script>
<style lang="less">
@import '../../src/style/var';
@import '../../../src/style/var';
body {
color: @text-color;

6
docs/site/demo-common.js → site/src/mobile/demo-common.js
View File

@ -5,9 +5,9 @@
import Vue from 'vue';
import VueRouter from 'vue-router';
import VantDoc, { DemoBlock, DemoSection } from '@vant/doc';
import i18n from './utils/i18n';
import Vant, { Lazyload, Locale } from '../../src';
import { camelize } from '../../src/utils/format/string';
import i18n from '../utils/i18n';
import Vant, { Lazyload, Locale } from '../../../src';
import { camelize } from '../../../src/utils/format/string';
Vue
.use(Vant)

11
docs/site/mobile.js → site/src/mobile/main.js
View File

@ -1,13 +1,14 @@
import '../../src/index.less';
import '../../../src/index.less';
import Vue from 'vue';
import VueRouter from 'vue-router';
import App from './WapApp';
import routes from './router';
import { importAll } from './utils';
import App from './App';
import routes from '../router';
import { importAll } from '../utils';
import '@vant/touch-emulator';
import '../sw';
const componentMap = {};
const context = require.context('../../src', true, /demo\/index.vue$/);
const context = require.context('../../../src', true, /demo\/index.vue$/);
importAll(componentMap, context);

2
docs/site/router.js → site/src/router.js
View File

@ -2,7 +2,7 @@ import Vue from 'vue';
import docConfig from './doc.config';
import DemoList from './components/DemoList';
import DemoPages from './components/DemoPages';
import { demoWrapper } from './demo-common';
import { demoWrapper } from './mobile/demo-common';
import { initIframeRouter } from './utils/iframe-router';
initIframeRouter();

7
site/src/sw.js Normal file
View File

@ -0,0 +1,7 @@
/* eslint-disable no-console */
import { register } from 'register-service-worker';
if (process.env.NODE_ENV === 'production') {
register(`${process.env.BASE_URL}service-worker.js`, {});
}

0
docs/site/utils/i18n.js → site/src/utils/i18n.js
View File

0
docs/site/utils/iframe-router.js → site/src/utils/iframe-router.js
View File

0
docs/site/utils/index.js → site/src/utils/index.js
View File

0
docs/site/utils/lang.js → site/src/utils/lang.js
View File

7
site/tsconfig.json Normal file
View File

@ -0,0 +1,7 @@
{
"extends": "../tsconfig.json",
"include": [
"../types/**/*",
"../src/**/*"
]
}

35
site/vue.config.js Normal file
View File

@ -0,0 +1,35 @@
const path = require('path');
module.exports = {
publicPath: process.env.NODE_ENV === 'production' ? '/vant/' : '/',
pages: {
index: {
entry: 'src/desktop/main.js',
template: 'public/index.html',
filename: 'index.html'
},
mobile: {
entry: 'src/mobile/main.js',
template: 'public/index.html',
filename: 'mobile.html'
}
},
chainWebpack: config => config.resolve.extensions.prepend('.md'),
configureWebpack: {
module: {
rules: [
{
test: /\.md$/,
use: ['vue-loader', '@vant/markdown-loader']
}
]
}
},
css: {
loaderOptions: {
less: {
paths: [path.resolve(__dirname, '../node_modules')]
}
}
}
};

7537
site/yarn.lock Normal file
View File

File diff suppressed because it is too large Load Diff

2
test/demo-test.ts
View File

@ -1,5 +1,5 @@
import Vue from 'vue';
import '../docs/site/demo-common';
import '../site/src/mobile/demo-common';
import Locale from '../src/locale';
import { mount, later } from './utils';

1021
yarn.lock
View File

File diff suppressed because it is too large Load Diff