# nuxt-wx-cli > My wicked Nuxt.js project Latest version **1.0.0** (published 2020-08-02) · 0 weekly downloads ## Install ```sh npm install nuxt-wx-cli pnpm add nuxt-wx-cli yarn add nuxt-wx-cli bun add nuxt-wx-cli ``` ## Health **Score 15/100 (F)** — status: abandoned. Positive: no vulnerabilities. Warnings: low downloads; no types; no esm support. Negative: abandoned; low maintenance score. ## Facts | | | |---|---| | Version | 1.0.0 | | Published | 2020-08-02 | | First published | 2020-08-02 | | Weekly downloads | 0 | | TypeScript types | none | | Module format | CommonJS | | Dependencies | 16 | | Unpacked size | 124.4 KB | | Known vulnerabilities | 0 (+3 in 2 direct dependencies) | | Install scripts | no | | Author | mrzou | | Maintainers | zoujian | ## Links - npm: https://www.npmjs.com/package/nuxt-wx-cli - npm.io page: https://npm.io/package/nuxt-wx-cli ## Dependencies (16) - [nuxt](https://npm.io/package/nuxt.md) ^2.0.0 - [vant](https://npm.io/package/vant.md) ^2.8.1 - [mockjs](https://npm.io/package/mockjs.md) ^1.1.0 - [express](https://npm.io/package/express.md) ^4.16.4 - [cross-env](https://npm.io/package/cross-env.md) ^5.2.0 - [driver.js](https://npm.io/package/driver.js.md) ^0.9.8 - [alloylever](https://npm.io/package/alloylever.md) ^1.0.4 - [html2canvas](https://npm.io/package/html2canvas.md) 1.0.0-rc.4 - [good-storage](https://npm.io/package/good-storage.md) ^1.1.1 - [ua-parser-js](https://npm.io/package/ua-parser-js.md) ^0.7.21 - [@nuxtjs/axios](https://npm.io/package/@nuxtjs/axios.md) ^5.10.3 - [better-scroll](https://npm.io/package/better-scroll.md) ^1.15.2 - [weixin-js-sdk](https://npm.io/package/weixin-js-sdk.md) ^1.4.0-test - [mta-h5-analysis](https://npm.io/package/mta-h5-analysis.md) ^2.0.15 - [@nuxtjs/style-resources](https://npm.io/package/@nuxtjs/style-resources.md) ^1.0.0 - [nuxt-property-decorator](https://npm.io/package/nuxt-property-decorator.md) ^2.7.2 ## Recent versions - 1.0.0 (latest) — 2020-08-02 ## README - [kw-payment](#kw-payment) - [后台给出的接口 code 规范](#%E5%90%8E%E5%8F%B0%E7%BB%99%E5%87%BA%E7%9A%84%E6%8E%A5%E5%8F%A3-code-%E8%A7%84%E8%8C%83) - [后台支付签名中的坑](#%E5%90%8E%E5%8F%B0%E6%94%AF%E4%BB%98%E7%AD%BE%E5%90%8D%E4%B8%AD%E7%9A%84%E5%9D%91) - [消除回车换行格式问题](#%E6%B6%88%E9%99%A4%E5%9B%9E%E8%BD%A6%E6%8D%A2%E8%A1%8C%E6%A0%BC%E5%BC%8F%E9%97%AE%E9%A2%98) - [css 规范](#css-%E8%A7%84%E8%8C%83) - [common 组件规范](#common-%E7%BB%84%E4%BB%B6%E8%A7%84%E8%8C%83) - [components 组件规范](#components-%E7%BB%84%E4%BB%B6%E8%A7%84%E8%8C%83) - [plugins 规范](#plugins-%E8%A7%84%E8%8C%83) - [transformers 规范](#transformers-%E8%A7%84%E8%8C%83) - [utils 规范](#utils-%E8%A7%84%E8%8C%83) - [git commit 规范](#git-commit-%E8%A7%84%E8%8C%83) - [Build Setup](#build-setup) - [添加 sass](#%E6%B7%BB%E5%8A%A0-sass) - [添加 husky + commitlint](#%E6%B7%BB%E5%8A%A0-husky--commitlint) - [webstorm+Prettier+ESLint 实现保存格式化代码](#webstormprettiereslint-%E5%AE%9E%E7%8E%B0%E4%BF%9D%E5%AD%98%E6%A0%BC%E5%BC%8F%E5%8C%96%E4%BB%A3%E7%A0%81) - [添加 vant](#%E6%B7%BB%E5%8A%A0-vant) - [添加 rem 支持](#%E6%B7%BB%E5%8A%A0-rem-%E6%94%AF%E6%8C%81) - [autoprefixer](#autoprefixer) - [添加 Ts](#%E6%B7%BB%E5%8A%A0-ts) # kw-payment > 支付的重构项目，所有支付相关的重构都放这里 ## 后台给出的接口 code 规范 - [doc => apiCode 规范](doc/apiCode.md) ## 后台支付签名中的坑 - 支付接口： /sppay/prescription, 返回签名参数 timeStamp 中的 **s** 是大写 - 微信 chooseWXPay 接口要求的是小写 timestamp ## 消除回车换行格式问题 ```bash git config --global core.autocrlf false ``` ## css 规范 - [assets => css 规范](assets/README.md) ## common 组件规范 - [组件规范文档地址](common/README.md) ## components 组件规范 - [组件规范文档地址](components/README.md) ## plugins 规范 - [plugins 规范文档地址](plugins/README.md) ## transformers 规范 - [transformers 规范文档地址](transformers/README.md) ## utils 规范 - [utils 规范文档地址](utils/README.md) ## git commit 规范 ```javascript /** * 自定义规范 * commit message的格式: 包括三个字段：type（必需）、scope（可选）和subject（必需） * type: 注意冒号后面要留空格, * scope: 可以省略；用于说明 commit 的影响范围，比如数据层、控制层、视图层等等，视项目不同而不同 * * subject：subject 是 commit 目的的简短描述，不超过50个字符, 不能以大写字母开头 * 以动词开头，使用第一人称现在时，比如change，而不是changed或changes第一个字母小写 * 结尾不加句号（.） * * 如：git commit -m "feat(): 添加commitlint" * 有一种比较特殊的情况： revert, 如果当前 commit 用于撤销以前的 commit，则必须以revert:开头，后面跟着被撤销 Commit 的 Header * 如：revert: feat(pencil): add 'graphiteWidth' option * * feat: 新特性 (feature) * fix: bug 修复 * opt: 优化 * style: 格式 (不影响代码运行的变动) * docs: 文档 * test: 测试用例新增 * refactor: 重构 * chore：构建过程或辅助工具的变动 * revert: 回滚到上一个版本 * * 每个规则配置分为三个主要部分: <规则名>: [{Level}, {Applicable}, {Value}]. * Level: * 0 表示不启用; * 1 表示启用但是会提示警告信息而不中断提交; * 2 表示启用并以错误信息提示, 中断提交过程. * Applicable: always | never * Value: 值 * */ ``` ## Build Setup ```bash # install dependencies $ yarn install # serve with hot reload at localhost:3000 $ yarn dev # build for production and launch server $ yarn build $ yarn start # generate static project $ yarn generate ``` ## 添加 sass ``` yarn add css-loader node-sass postcss-loader sass-loader style-loader -D ``` ## 添加 husky + commitlint ```bash yarn add --save-dev @commitlint/config-conventional @commitlint/cli yarn add --dev husky echo > commitlint.config.js module.exports = { extends: ['@commitlint/config-conventional'], rules: { 'type-enum': [2, 'always', [ 'feat','fix','style','docs','test','refactor', 'chore', 'revert' ]] } }; 创建 .huskyrc "hooks": { "commit-msg": "commitlint -E HUSKY_GIT_PARAMS" } ``` ## webstorm+Prettier+ESLint 实现保存格式化代码 ``` Prettier File” >> "Settings" >> "Tools" >> "File Watchers" >> 新建 Prettier Any All Places $ProjectFileDir$\node_modules\.bin\prettier.cmd --write $FilePathRelativeToProjectRoot$ $FilePathRelativeToProjectRoot$ $ProjectFileDir$ ESLint File” >> "Settings" >> "Tools" >> "File Watchers" >> 新建 ESLint Any All Places $ProjectFileDir$\node_modules\.bin\eslint.cmd --fix $FilePathRelativeToProjectRoot$ $FilePathRelativeToProjectRoot$ $ProjectFileDir$ 关闭自动保存 File” >> "Settings" >> "Tools" >> "File Watchers" >> Prettier || ESLint 关掉 Auto-save edited files to trigger the watcher File” >> "Settings" >> "Appearance & Behavior" >> "system settings" 关掉 synchronization下面的四个选项 ``` ## 添加 vant ```bash yarn add vant yarn add babel-plugin-import less less-loader -D // webpack build: { // 添加这个是关键，添加后babel才会处理依赖包vant里面的代码 transpile: [/vant.*?less/], babel: { plugins: [ [ 'import', { libraryName: 'vant', style: (name) => { return `${name}/style/less.js` } }, 'vant' ] ] } } // 主题定制, 在build下插入loaders less-loader不能用6.0，刚升级的有兼容问题，改用5.0 https://github.com/ant-design/ant-design-landing/issues/235 $ yarn remove less-loader $ yarn add less-loader@5.0.0 -D $ yarn dev loaders: { less: { javascriptEnabled: true, modifyVars: { hack: `true; @import "${resolve( './assets/styles/vant_theme_var.less' )}";` } } } ``` ## 添加 rem 支持 ```bash yarn add postcss-px2rem-exclude lib-flexible -D ``` ``` // webpack build: { postcss: [ require('postcss-plugin-px2rem')({ rootValue: 37.5, minPixelValue: 3, exclude: '/node_modules/', selectorBlackList: ['.van-dialog'] // 排除以.van-dialog开头的所有class }), require('autoprefixer') ] } if (process.client) { require('lib-flexible/flexible') } ``` # autoprefixer ``` yarn add autoprefixer -D // package.json添加以下配，不配置autoprefixer不执行 "browserslist": [ "> 1%", "last 2 versions", "not ie <= 8", "ios >= 8", "android >= 4.0" ], ``` ## 添加 Ts ```bash yarn add @nuxt/typescript-build ts-loader typescript -D // 新建 tsconfig.json { "compilerOptions": { "experimentalDecorators": true, "emitDecoratorMetadata": true, "moduleResolution": "node", "lib": ["dom","es2016"], "target": "es5", "allowJs": true }, "exclude": ["node_modules", ".nuxt", "dist"] } // webpack build: { extend (config, ctx) { config.resolve.extensions.unshift('.ts') config.module.rules.push({ test: /\.(tsx|ts)?$/, loader: 'ts-loader', exclude: /node_modules/, options: { appendTsSuffixTo: [/\.vue$/] } }) } } 新建 /types/vue-shims.d.ts import Vue from 'vue' import VueRouter from 'vue-router' import { Route } from 'vue-router' declare module '*.vue' { import Vue from 'vue' export default Vue } // 扩充 declare module 'vue/types/vue' { interface Vue { $router: VueRouter $route: Route } } ``` For detailed explanation on how things work, check out [Nuxt.js docs](https://nuxtjs.org). --- _Source: https://npm.io/package/nuxt-wx-cli · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._