VUE-THinkPHP前后端全栈开发学习
VUE-THinkPHP前后端全栈开发学习
环境配置
后端环境配置
后端主要用到ThinkPhp框架，第一步是安装PHP，在WIndows上可以借助Xampp实现一键式的环境搭建。
下载和安装好Xampp后打开Apache；
第一步：然后修改D:\Software\Xampp\apache\conf\httpd.conf文件，即XAMPP目录中的apache文件夹下的conf文件，将其中的
DocumentRoot "D:/Software/Xampp/htdocs"
<Directory "D:/Software/Xampp/htdocs">
改为thinkphp所在目录的上级目录，如目录所在是：D:\QuanZhanXueXi\Houduan\PHP\php_template，那么就把上述改成
DocumentRoot "D:/QuanZhanXueXi/Houduan/PHP/"
<Directory "D:/QuanZhanXueXi/Houduan/PHP/">
注意不要忘了最后的/。
第二步：在D:\Software\Xampp\apache\conf\extra\httpd-vhosts.conf 文件的末尾添加
<VirtualHost *:80>
DocumentRoot "D:/QuanZhanXueXi/Houduan/PHP/php_template/public"
ServerName phplearn.com
</VirtualHost>
即thinkphp项目的public文件夹，ServerName随便取什么名字，VirtualHost即访问的端口号，默认为80。
这样子就完成了ThinkPhp项目在Windows上的服务器部署。
接下来是配置ThinkPHP相关，首先安装composer，安装时候选择xampp中的php环境。安装好后打开命令行，定位到项目所在的目录，通过composer update --ignore-platform-req=ext-gd命令安装thinkphp项目所需要的包。安装完成后打开127.0.0.1就可以访问了。只不过因为它是后端项目，没有页面，需要调用接口。
遇到的问题，有时候提示
The package is not available in a stable-enough version according to your minimum-stability setting可以考虑在composer.json文件中用如下代码替换：
"repositories": {
"packagist": {
"type": "composer",
"url": "https://mirrors.aliyun.com/composer"
}
}
前端环境配置
第一步：下载并安装NodeJs。版本需要是16.14.0的，太高版本不行。
第二步：打开命令行安装cnpm
npm install -g cnpm --registry=https://registry.npm.taobao.org
第三步： 打开Vue项目，使用rm -rf ./ node_modules``删除 node_modules文件夹
第四步：安装node-sass
npm i node-sass --sass_binary_site=https://npm.taobao.org/mirrors/node-sass/
如果上一句失败则执行下面，将已下载东西 重新编译
npm rebuild node-sass
安装其余的依赖
cnpm install
完成以后通过下面命令运行
cnpm run dev
遇到的问题：(linebreak-style) Expected linebreaks to be ‘LF‘ but found ‘CRLF‘. (eslint)，这是因为Linux项目在Windows上打开引起的。
-
解决办法1：在项目的根目录创建.editorconfig文件，并填入如下：
[*.{js,jsx,ts,tsx,vue}] indent_style = space indent_size = 2 end_of_line = lf trim_trailing_whitespace = true insert_final_newline = true max_line_length = 100 -
解决办法2：在项目中搜素
linebreak-style，并改为：'linebreak-style':[0,'error','window'],
配置中遇到的Bug解决
BUG 1：控制器不存在:app\controller\Index
解决办法：在入口文件夹public下查看.htaccess是否存在。不存在则新建，存在的话，那内容替换为下面这串代码 就可以解决Not Fund
#<IfModule mod_rewrite.c>
# Options +FollowSymlinks -Multiviews
# RewriteEngine On
#
# RewriteCond %{REQUEST_FILENAME} !-d
# RewriteCond %{REQUEST_FILENAME} !-f
# RewriteRule ^(.*)$ index.php/$1 [QSA,PT,L]
#</IfModule>
<IfModule mod_rewrite.c>
RewriteEngine on
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^(.*)$ index.php?/$1 [QSA,PT,L]
</IfModule>
BUG 2：mysql版本问题,在my.ini中的[mysqld]下面加一行
sql_mode=STRICT_TRANS_TABLES,NO_ZERO_IN_DATE,NO_ZERO_DATE,ERROR_FOR_DIVISION_BY_ZERO,NO_AUTO_CREATE_USER,NO_ENGINE_SUBSTITUTION
BUG 3：安装好Nodejs后，使用 npm install -g cnpm --registry=https://registry.npm.taobao.org 时报错：
npm ERR! code CERT_HAS_EXPIRED
npm ERR! errno CERT_HAS_EXPIRED
npm ERR! request to https://registry.npm.taobao.org/cnpm failed, reason: certificate has expired
npm ERR! A complete log of this run can be found in: C:\Users\lwp57\AppData\Local\npm-cache\_logs\2024-04-02T11_57_35_816Z-debug-0.log
解决办法：设计源镜像
npm config set registry https://registry.npmmirror.com
npm install npm -g #更新版本
npm install -g cnpm #安装cnpm
