Summary about responses:
.htaccess
on local machinevim /etc/apache2/httpd.conf
RewriteEngine on
RewriteRule ^(.*presentations/)(assets/)(.*)$ $1~$2$3 [L,QSA,NC]
sudo /usr/sbin/apachectl restart
And that works great for me.
Local Machine Dependent.
replace
add-onif (module.hot) {
// dev code
}
env
It should be one good practice. However, personally speaking, I have no enough knowledge about this methods. [TODO:]
It should also be one good practice. However, personally speaking, I have no enough knowledge about this methods. [TODO:]
script.js
to ~script.js
on VPSServer Dependent
sub_filter
rewrite on VPSlocation / {
sub_filter '/presentations/assets/' '/presentations/~assets/';
sub_filter_once off;
}
Or more advanced configuration employing regex match and replace, see https://www.nginx.com/resources/wiki/modules/substitutions/ for nginx_substitutions_filter
.
Server Dependent.
window.location.host
Based LoadingDomain Dependent.
load.js
method (?)I guess it is the same as above window.location.host
based method.
Domain Dependent
If this detect the existence of /~assets/
first and if not then load /assets/
, the could be the perfect solution.
However, no idea how to implement this.
hosts
I understand this as two absolutely different sites, not sharing the same index.html
Local Machine Dependent
Summary about responses and further handling can also be accessed via this link: Including Different css and js Files for Development and Deployment Environment by the Same index.html without Error.
1
ericls 2017-01-13 07:50:00 +08:00
通过环境变量配合 webpack 的 replace 插件
|
2
fucker 2017-01-13 09:06:02 +08:00
我有办法
|
3
spritevan 2017-01-13 09:19:25 +08:00
if (module.hot) {
// dev code } |
4
justyy 2017-01-13 09:22:57 +08:00
楼主 字写得很漂亮
|
5
lwbjing 2017-01-13 09:32:35 +08:00
|
6
naomhan 2017-01-13 09:39:06 +08:00
感觉最简单的就是 switchhosts 了 代码都不要改 线上内网各布一套
|
7
ragnaroks 2017-01-13 10:41:28 +08:00
index 硬是看成了 mdx,
纯前端的情况下,可能得依靠一个 load.js 来做判断了 |
8
learnshare 2017-01-13 11:09:23 +08:00
Gulp 写两个编译任务
|
9
airyland 2017-01-13 12:36:44 +08:00
需求不复杂,用 webpack 可破,两个 env 不同配置即可,开发时 dev 配置一套,要上线构建时另一套。
|
10
happyjohann OP @ericls 能给个教程链接不?我对前端开发工具还不熟悉。
|
11
happyjohann OP @spritevan 这个是用在什么环境下的,纯前端应该没办法直接用未定义的 module 吧,能解释一下么?
|
12
happyjohann OP @justyy 这并不是重点,想法来了,所以就胡乱写了
|
13
happyjohann OP @ragnaroks load.js 具体内容如何写,能赐教不?谢谢
|
14
happyjohann OP @learnshare 有参考教程不?谢谢
|
15
happyjohann OP @airyland 能给个参考教程不?对这个工具还不熟。谢谢
|
16
ragnaroks 2017-01-13 14:40:19 +08:00
假设你线下是 localhost,那 host 就会是 http://localhost/xxxx,线上是 http://domain.com/xxx
直接判断一下就在 js 里面加载不同的资源 |
17
spritevan 2017-01-13 14:43:50 +08:00
@happyjohann module.hot 是和 @airyland 一样依靠 webpack
差异在于他通过不同的配置文件来配置构建流程 module.hot 是用来判断是否开启热更新的状态,通常等价于测试环境 ;-) 原理很简单,也可以通过声明其他环境变量(比如检测域名)来标识开发/生产环境 |
18
jarlyyn 2017-01-13 14:47:02 +08:00
nginx 做个 sub_filter 就能搞定的事情。
怎么这么复杂了。 |
19
happyjohann OP @ragnaroks 我本地用的是 project.static.domain 类似的 URL ,不想写成 URL based , case based 代码。谢谢建议啊😄
|
20
happyjohann OP @spritevan 嗯,和通过 module 判断是前端还是 node 的通用库一样。谢谢。看来又要学新东西了, webpack 之前只听说没用过
|
21
happyjohann OP @jarlyyn 你这个方案我比较喜欢啊。能告知一下 fileter 具体怎么写么?谢谢
|
22
jarlyyn 2017-01-13 15:03:06 +08:00
前端挂个 nginx 反代
加一行 location / { sub_filter '/skin/production' '/skin/development; sub_filter_once off; } 不久好了么。 |
23
happyjohann OP @fucker 愿闻其详
|
24
happyjohann OP @jarlyyn 不错,谢谢。 sub_filter 是字串替换吗?我在想用正则去掉如例子所示的~😄
|
25
jarlyyn 2017-01-13 15:12:47 +08:00
@happyjohann
你把开发和生产的直接分两个目录不久好了…… sub_filter 是字符串替换 要正则的话就要用到 nginx_substitutions_filter 这个库了 https://www.nginx.com/resources/wiki/modules/substitutions/ |
26
learnshare 2017-01-13 15:14:45 +08:00
|
27
happyjohann OP @jarlyyn 其实是在构建自己的最佳实践框架,放不同目录的问题是修改代码的时候需要切换文件夹。不过谢谢建议,准备采用两文件夹结构了,毕竟看起来更清爽。
|
28
happyjohann OP @learnshare 这个 Google 链接就和我自己找一样了。对 gulp 不熟悉所以重点是不知道两个编译任务相关如何构建,甚至都不知道合适关键词,也不具备搜索结果筛选能力😭
|
29
jarlyyn 2017-01-13 16:00:34 +08:00
|
30
happyjohann OP @jarlyyn 哈哈哈,看来你的配置方法用的比较灵活啊。不过问题是不太具备可移植性。只能在你的机器(服务器或者本地机器),别人的机器没有配置同样的 nginx 配置或者 symbolic link 就搞不定了啊
|
31
shengchao 2017-01-13 17:56:45 +08:00
提供一个方案, js 判断 window.location.host 是什么,动态给 index.html 插入 css 和 js 标签。
|
32
deleted 2017-01-13 17:58:59 +08:00 via Android
模板里写个 if 可行?
|
33
happyjohann OP @deleted 有思路怎么写吗?
|
34
happyjohann OP My own solution:
Since Apache is shipped with macOS, so personally I use Apache for development and Nginx for production. And my apache configuration (the psudo-one since i am using this rule for just one subfolder) is as following: ```apache RewriteEngine on RewriteRule ^(.*)(assets/)(.*)$ $1~$2$3 [L,QSA,NC] ``` Sorry for English, currently Chinese input is broken. |
35
deleted 2017-01-14 02:21:01 +08:00 via Android
@happyjohann 秀英语
|
36
happyjohann OP @deleted 人不在国内呀,用学校的电脑是没有中文输入法的
|
37
cctrv 2017-01-30 04:44:05 +08:00 via iPhone
.htcaccess 是一個方案。
開發機配置 hosts 也是一個方案。 |