Paso 1: inicializar el proyecto
Con la herramienta de línea de comandos Vue.js vue-cli, solo necesita ingresar unos pocos comandos simples en la ventana del terminal para crear e iniciar rápidamente un pequeño proyecto de programa con recarga en caliente, verificación estática al guardar y funciones de construcción de código integradas :
# 全局安装 vue-cli
$ npm install --global vue-cli
/* 这一步我是需要，但是也有人不需要，大家看着办，npm不行就用 cnpm */
# 全局安装 @vue/cli-init
$ npm install -g @vue/cli-init
# 创建一个基于 mpvue-quickstart 模板的新项目
$ vue init mpvue/mpvue-quickstart my-project
# 安装依赖
$ cd my-project
$ npm install
# 启动构建
$ npm run dev
或
$ npm start
Después de la creación, primero abra el archivo .eslintignore y complete estas dos oraciones. Para su comodidad, no permita que primero verifique estos dos archivos:
A continuación, solo necesita iniciar la herramienta de desarrollo WeChat, importar el proyecto y obtener una vista previa en su primera página .Un subprograma mpvue.
Paso 2: construye parte de la página principal
Primero oculte la página generada automáticamente, créela usted mismo, cambie la carpeta src original a src-demo y cree una nueva carpeta src
usted mismo:
luego cree un nuevo archivo app.vue en su propia carpeta src: cree un nuevo archivo de entrada principal .js:
Luego puede crear las páginas de la carpeta de la página. Tenga en cuenta que cada página tiene un archivo de entrada main.js:
Cree un archivo de configuración global app.json:
Finalmente, elimine la carpeta dist anterior., Y deje que se vuelva a empaquetar:
(Esta captura de pantalla tiene errores, recuerde primero cd my-project y luego npm start / npm run dev)
Finalmente, abra nuestra herramienta de desarrollo WeChat y compílela, y podrá ver la página que escribimos:
Luego podemos crear un archivo main.json para esta página y cambiar la apariencia de esta página:
Vuelva a la herramienta de desarrollo WeChat para compilar , Eso es todo:
