vue2版本做了一个13个页面的项目,算是小项目了,但是这个项目就像麻雀一样,虽小但是五脏齐全
1.vue2框架
属性filter:
Vue.filter('capitalize', function (value) { // 过滤**状态
if (value) {
switch (value) {
case '状态一参数':
return '状态一描述'
case '状态二参数':
return '状态二描述'
case '状态三参数':
return '状态三描述'
case '状态四参数':
return '状态四描述'
}
}
})
2.webstorm开发软件
双击dev:是运行该项目
双击build:是打包该项目(将项目中的dist文件放入服务器上即可)
3.webpack打包
打包的项目文件名为dist,为了打包发布后看不到css和js 将config里的index.js内的参数改为false
4.vue2在tomcat环境下部署
在服务器上安装tomcat软件
1.添加根路径base:/服务器上的项目文件名
2.将config里的web.xml里的内容改为:(为了刷新报404)
<?xml version=”1.0″ encoding=”ISO-8859-1″?>
<!–
Licensed to the Apache Software Foundation (ASF) under one or more
contributor license agreements. See the NOTICE file distributed with
this work for additional information regarding copyright ownership.
The ASF licenses this file to You under the Apache License, Version 2.0
(the “License”); you may not use this file except in compliance with
the License. You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an “AS IS” BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
–>
<web-app xmlns=”http://java.sun.com/xml/ns/javaee”
xmlns:xsi=”http://www.w3.org/2001/XMLSchema-instance”
xsi:schemaLocation=”http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd”
version=”2.5″>
<!– ======================== Introduction ============================== –>
<!– This document defines default values for *all* web applications –>
<!– loaded into this instance of Tomcat. As each application is –>
<!– deployed, this file is processed, followed by the –>
<!– “/WEB-INF/web.xml” deployment descriptor from your own –>
<!– applications. –>
<!– –>
<!– WARNING: Do not configure application-specific resources here! –>
<!– They should go in the “/WEB-INF/web.xml” file in your application. –>
<!– ================== Built In Servlet Definitions ==================== –>
<!– The default servlet for all web applications, that serves static –>
<!– resources. It processes all requests that are not mapped to other –>
<!– servlets with servlet mappings (defined either here or in your own –>
<!– web.xml file. This servlet supports the following initialization –>
<!– parameters (default values are in square brackets): –>
<!– –>
<!– debug Debugging detail level for messages logged –>
<!– by this servlet. [0] –>
<!– –>
<!– fileEncoding Encoding to be used to read static resources –>
<!– [platform default] –>
<!– –>
<!– input Input buffer size (in bytes) when reading –>
<!– resources to be served. [2048] –>
<!– –>
<!– listings Should directory listings be produced if there –>
<!– is no welcome file in this directory? [false] –>
<!– WARNING: Listings for directories with many –>
<!– entries can be slow and may consume –>
<!– significant proportions of server resources. –>
<!– –>
<!– output Output buffer size (in bytes) when writing –>
<!– resources to be served. [2048] –>
<!– –>
<!– readonly Is this context “read only”, so HTTP –>
<!– commands like PUT and DELETE are –>
<!– rejected? [true] –>
<!– –>
<!– readmeFile File name to display with the directory –>
<!– contents. [null] –>
<!– –>
<!– sendfileSize If the connector used supports sendfile, this –>
<!– represents the minimal file size in KB for –>
<!– which sendfile will be used. Use a negative –>
<!– value to always disable sendfile. [48] –>
<!– –>
<!– useAcceptRanges Should the Accept-Ranges header be included –>
<!– in responses where appropriate? [true] –>
<!– –>
<!– For directory listing customization. Checks localXsltFile, then –>
<!– globalXsltFile, then defaults to original behavior. –>
<!– –>
<!– localXsltFile Make directory listings an XML doc and –>
<!– pass the result to this style sheet residing –>
<!– in that directory. This overrides –>
<!– contextXsltFile and globalXsltFile[null] –>
<!– –>
<!– contextXsltFile Make directory listings an XML doc and –>
<!– pass the result to this style sheet which is –>
<!– relative to the context root. This overrides –>
<!– globalXsltFile[null] –>
<!– –>
<!– globalXsltFile Site wide configuration version of –>
<!– localXsltFile This argument is expected –>
<!– to be a physical file. [null] –>
<!– –>
<!– –>
<servlet>
<servlet-name>default</servlet-name>
<servlet-class>org.apache.catalina.servlets.DefaultServlet</servlet-class>
<init-param>
<param-name>debug</param-name>
<param-value>0</param-value>
</init-param>
<init-param>
<param-name>listings</param-name>
<param-value>false</param-value>
</init-param>
<load-on-startup>1</load-on-startup>
</servlet>
<!– This servlet has been deprecated due to security concerns. Servlets –>
<!– should be explicitly mapped in web.xml –>
<!– –>
<!– The “invoker” servlet, which executes anonymous servlet classes –>
<!– that have not been defined in a web.xml file. Traditionally, this –>
<!– servlet is mapped to the URL pattern “/servlet/*”, but you can map –>
<!– it to other patterns as well. The extra path info portion of such a –>
<!– request must be the fully qualified class name of a Java class that –>
<!– implements Servlet (or extends HttpServlet), or the servlet name –>
<!– of an existing servlet definition. This servlet supports the –>
<!– following initialization parameters (default values are in square –>
<!– brackets): –>
<!– –>
<!– debug Debugging detail level for messages logged –>
<!– by this servlet. [0] –>
<!–
<servlet>
<servlet-name>invoker</servlet-name>
<servlet-class>
org.apache.catalina.servlets.InvokerServlet
</servlet-class>
<init-param>
<param-name>debug</param-name>
<param-value>0</param-value>
</init-param>
<load-on-startup>2</load-on-startup>
</servlet>
–>
<!– The JSP page compiler and execution servlet, which is the mechanism –>
<!– used by Tomcat to support JSP pages. Traditionally, this servlet –>
<!– is mapped to the URL pattern “*.jsp”. This servlet supports the –>
<!– following initialization parameters (default values are in square –>
<!– brackets): –>
<!– –>
<!– checkInterval If development is false and checkInterval is –>
<!– greater than zero, background compilations are –>
<!– enabled. checkInterval is the time in seconds –>
<!– between checks to see if a JSP page (and its –>
<!– dependent files) needs to be recompiled. [0] –>
<!– –>
<!– classdebuginfo Should the class file be compiled with –>
<!– debugging information? [true] –>
<!– –>
<!– classpath What class path should I use while compiling –>
<!– generated servlets? [Created dynamically –>
<!– based on the current web application] –>
<!– –>
<!– compiler Which compiler Ant should use to compile JSP –>
<!– pages. See the jasper documentation for more –>
<!– information. –>
<!– –>
<!– compilerSourceVM Compiler source VM. [1.5] –>
<!– –>
<!– compilerTargetVM Compiler target VM. [1.5] –>
<!– –>
<!– development Is Jasper used in development mode? If true, –>
<!– the frequency at which JSPs are checked for –>
<!– modification may be specified via the –>
<!– modificationTestInterval parameter. [true] –>
<!– –>
<!– displaySourceFragment –>
<!– Should a source fragment be included in –>
<!– exception messages? [true] –>
<!– –>
<!– dumpSmap Should the SMAP info for JSR45 debugging be –>
<!– dumped to a file? [false] –>
<!– False if suppressSmap is true –>
<!– –>
<!– enablePooling Determines whether tag handler pooling is –>
<!– enabled. This is a compilation option. It will –>
<!– not alter the behaviour of JSPs that have –>
<!– already been compiled. [true] –>
<!– –>
<!– engineOptionsClass Allows specifying the Options class used to –>
<!– configure Jasper. If not present, the default –>
<!– EmbeddedServletOptions will be used. –>
<!– –>
<!– errorOnUseBeanInvalidClassAttribute –>
<!– Should Jasper issue an error when the value of –>
<!– the class attribute in an useBean action is –>
<!– not a valid bean class? [true] –>
<!– –>
<!– fork Tell Ant to fork compiles of JSP pages so that –>
<!– a separate JVM is used for JSP page compiles –>
<!– from the one Tomcat is running in. [true] –>
<!– –>
<!– genStrAsCharArray Should text strings be generated as char –>
<!– arrays, to improve performance in some cases? –>
<!– [false] –>
<!– –>
<!– ieClassId The class-id value to be sent to Internet –>
<!– Explorer when using <jsp:plugin> tags. –>
<!– [clsid:8AD9C840-044E-11D1-B3E9-00805F499D93] –>
<!– –>
<!– javaEncoding Java file encoding to use for generating java –>
<!– source files. [UTF8] –>
<!– –>
<!– keepgenerated Should we keep the generated Java source code –>
<!– for each page instead of deleting it? [true] –>
<!– –>
<!– mappedfile Should we generate static content with one –>
<!– print statement per input line, to ease –>
<!– debugging? [true] –>
<!– –>
<!– modificationTestInterval –>
<!– Causes a JSP (and its dependent files) to not –>
<!– be checked for modification during the –>
<!– specified time interval (in seconds) from the –>
<!– last time the JSP was checked for –>
<!– modification. A value of 0 will cause the JSP –>
<!– to be checked on every access. –>
<!– Used in development mode only. [4] –>
<!– –>
<!– scratchdir What scratch directory should we use when –>
<!– compiling JSP pages? [default work directory –>
<!– for the current web application] –>
<!– –>
<!– suppressSmap Should the generation of SMAP info for JSR45 –>
<!– debugging be suppressed? [false] –>
<!– –>
<!– trimSpaces Should white spaces in template text between –>
<!– actions or directives be trimmed? [false] –>
<!– –>
<!– xpoweredBy Determines whether X-Powered-By response –>
<!– header is added by generated servlet [false] –>
<!– –>
<!– If you wish to use Jikes to compile JSP pages: –>
<!– Please see the “Using Jikes” section of the Jasper-HowTo –>
<!– page in the Tomcat documentation. –>
<servlet>
<servlet-name>jsp</servlet-name>
<servlet-class>org.apache.jasper.servlet.JspServlet</servlet-class>
<init-param>
<param-name>fork</param-name>
<param-value>false</param-value>
</init-param>
<init-param>
<param-name>xpoweredBy</param-name>
<param-value>false</param-value>
</init-param>
<load-on-startup>3</load-on-startup>
</servlet>
<!– NOTE: An SSI Filter is also available as an alternative SSI –>
<!– implementation. Use either the Servlet or the Filter but NOT both. –>
<!– –>
<!– Server Side Includes processing servlet, which processes SSI –>
<!– directives in HTML pages consistent with similar support in web –>
<!– servers like Apache. Traditionally, this servlet is mapped to the –>
<!– URL pattern “*.shtml”. This servlet supports the following –>
<!– initialization parameters (default values are in square brackets): –>
<!– –>
<!– buffered Should output from this servlet be buffered? –>
<!– (0=false, 1=true) [0] –>
<!– –>
<!– debug Debugging detail level for messages logged –>
<!– by this servlet. [0] –>
<!– –>
<!– expires The number of seconds before a page with SSI –>
<!– directives will expire. [No default] –>
<!– –>
<!– isVirtualWebappRelative –>
<!– Should “virtual” paths be interpreted as –>
<!– relative to the context root, instead of –>
<!– the server root? (0=false, 1=true) [0] –>
<!– –>
<!– inputEncoding The encoding to assume for SSI resources if –>
<!– one is not available from the resource. –>
<!– [Platform default] –>
<!– –>
<!– outputEncoding The encoding to use for the page that results –>
<!– from the SSI processing. [UTF-8] –>
<!–
<servlet>
<servlet-name>ssi</servlet-name>
<servlet-class>
org.apache.catalina.ssi.SSIServlet
</servlet-class>
<init-param>
<param-name>buffered</param-name>
<param-value>1</param-value>
</init-param>
<init-param>
<param-name>debug</param-name>
<param-value>0</param-value>
</init-param>
<init-param>
<param-name>expires</param-name>
<param-value>666</param-value>
</init-param>
<init-param>
<param-name>isVirtualWebappRelative</param-name>
<param-value>0</param-value>
</init-param>
<load-on-startup>4</load-on-startup>
</servlet>
–>
<!– Common Gateway Includes (CGI) processing servlet, which supports –>
<!– execution of external applications that conform to the CGI spec –>
<!– requirements. Typically, this servlet is mapped to the URL pattern –>
<!– “/cgi-bin/*”, which means that any CGI applications that are –>
<!– executed must be present within the web application. This servlet –>
<!– supports the following initialization parameters (default values –>
<!– are in square brackets): –>
<!– –>
<!– cgiPathPrefix The CGI search path will start at –>
<!– webAppRootDir + File.separator + this prefix. –>
<!– [WEB-INF/cgi] –>
<!– –>
<!– debug Debugging detail level for messages logged –>
<!– by this servlet. [0] –>
<!– –>
<!– executable Name of the executable used to run the –>
<!– script. [perl] –>
<!– –>
<!– parameterEncoding Name of parameter encoding to be used with –>
<!– CGI servlet. –>
<!– [System.getProperty(“file.encoding”,”UTF-8″)] –>
<!– –>
<!– passShellEnvironment Should the shell environment variables (if –>
<!– any) be passed to the CGI script? [false] –>
<!– –>
<!– stderrTimeout The time (in milliseconds) to wait for the –>
<!– reading of stderr to complete before –>
<!– terminating the CGI process. [2000] –>
<!–
<servlet>
<servlet-name>cgi</servlet-name>
<servlet-class>org.apache.catalina.servlets.CGIServlet</servlet-class>
<init-param>
<param-name>debug</param-name>
<param-value>0</param-value>
</init-param>
<init-param>
<param-name>cgiPathPrefix</param-name>
<param-value>WEB-INF/cgi</param-value>
</init-param>
<load-on-startup>5</load-on-startup>
</servlet>
–>
<!– ================ Built In Servlet Mappings ========================= –>
<!– The servlet mappings for the built in servlets defined above. Note –>
<!– that, by default, the CGI and SSI servlets are *not* mapped. You –>
<!– must uncomment these mappings (or add them to your application’s own –>
<!– web.xml deployment descriptor) to enable these services –>
<!– The mapping for the default servlet –>
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>/</url-pattern>
</servlet-mapping>
<!– The mapping for the deprecated invoker servlet –>
<!–
<servlet-mapping>
<servlet-name>invoker</servlet-name>
<url-pattern>/servlet/*</url-pattern>
</servlet-mapping>
–>
<!– The mapping for the JSP servlet –>
<servlet-mapping>
<servlet-name>jsp</servlet-name>
<url-pattern>*.jsp</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>jsp</servlet-name>
<url-pattern>*.jspx</url-pattern>
</servlet-mapping>
<!– The mapping for the SSI servlet –>
<!–
<servlet-mapping>
<servlet-name>ssi</servlet-name>
<url-pattern>*.shtml</url-pattern>
</servlet-mapping>
–>
<!– The mapping for the CGI Gateway servlet –>
<!–
<servlet-mapping>
<servlet-name>cgi</servlet-name>
<url-pattern>/cgi-bin/*</url-pattern>
</servlet-mapping>
–>
<!– ================== Built In Filter Definitions ===================== –>
<!– NOTE: An SSI Servlet is also available as an alternative SSI –>
<!– implementation. Use either the Servlet or the Filter but NOT both. –>
<!– –>
<!– Server Side Includes processing filter, which processes SSI –>
<!– directives in HTML pages consistent with similar support in web –>
<!– servers like Apache. Traditionally, this filter is mapped to the –>
<!– URL pattern “*.shtml”, though it can be mapped to “*” as it will –>
<!– selectively enable/disable SSI processing based on mime types. For –>
<!– this to work you will need to uncomment the .shtml mime type –>
<!– definition towards the bottom of this file. –>
<!– The contentType init param allows you to apply SSI processing to JSP –>
<!– pages, javascript, or any other content you wish. This filter –>
<!– supports the following initialization parameters (default values are –>
<!– in square brackets): –>
<!– –>
<!– contentType A regex pattern that must be matched before –>
<!– SSI processing is applied. –>
<!– [text/x-server-parsed-html(;.*)?] –>
<!– –>
<!– debug Debugging detail level for messages logged –>
<!– by this servlet. [0] –>
<!– –>
<!– expires The number of seconds before a page with SSI –>
<!– directives will expire. [No default] –>
<!– –>
<!– isVirtualWebappRelative –>
<!– Should “virtual” paths be interpreted as –>
<!– relative to the context root, instead of –>
<!– the server root? (0=false, 1=true) [0] –>
<!–
<filter>
<filter-name>ssi</filter-name>
<filter-class>
org.apache.catalina.ssi.SSIFilter
</filter-class>
<init-param>
<param-name>contentType</param-name>
<param-value>text/x-server-parsed-html(;.*)?</param-value>
</init-param>
<init-param>
<param-name>debug</param-name>
<param-value>0</param-value>
</init-param>
<init-param>
<param-name>expires</param-name>
<param-value>666</param-value>
</init-param>
<init-param>
<param-name>isVirtualWebappRelative</param-name>
<param-value>0</param-value>
</init-param>
</filter>
–>
<!– ==================== Built In Filter Mappings ====================== –>
<!– The mapping for the SSI Filter –>
<!–
<filter-mapping>
<filter-name>ssi</filter-name>
<url-pattern>*.shtml</url-pattern>
</filter-mapping>
–>
<!– ==================== Default Session Configuration ================= –>
<!– You can set the default session timeout (in minutes) for all newly –>
<!– created sessions by modifying the value below. –>
<session-config>
<session-timeout>30</session-timeout>
</session-config>
<!– ===================== Default MIME Type Mappings =================== –>
<!– When serving static resources, Tomcat will automatically generate –>
<!– a “Content-Type” header based on the resource’s filename extension, –>
<!– based on these mappings. Additional mappings can be added here (to –>
<!– apply to all web applications), or in your own application’s web.xml –>
<!– deployment descriptor. –>
<mime-mapping>
<extension>abs</extension>
<mime-type>audio/x-mpeg</mime-type>
</mime-mapping>
<mime-mapping>
<extension>ai</extension>
<mime-type>application/postscript</mime-type>
</mime-mapping>
<mime-mapping>
<extension>aif</extension>
<mime-type>audio/x-aiff</mime-type>
</mime-mapping>
<mime-mapping>
<extension>aifc</extension>
<mime-type>audio/x-aiff</mime-type>
</mime-mapping>
<mime-mapping>
<extension>aiff</extension>
<mime-type>audio/x-aiff</mime-type>
</mime-mapping>
<mime-mapping>
<extension>aim</extension>
<mime-type>application/x-aim</mime-type>
</mime-mapping>
<mime-mapping>
<extension>art</extension>
<mime-type>image/x-jg</mime-type>
</mime-mapping>
<mime-mapping>
<extension>asf</extension>
<mime-type>video/x-ms-asf</mime-type>
</mime-mapping>
<mime-mapping>
<extension>asx</extension>
<mime-type>video/x-ms-asf</mime-type>
</mime-mapping>
<mime-mapping>
<extension>au</extension>
<mime-type>audio/basic</mime-type>
</mime-mapping>
<mime-mapping>
<extension>avi</extension>
<mime-type>video/x-msvideo</mime-type>
</mime-mapping>
<mime-mapping>
<extension>avx</extension>
<mime-type>video/x-rad-screenplay</mime-type>
</mime-mapping>
<mime-mapping>
<extension>bcpio</extension>
<mime-type>application/x-bcpio</mime-type>
</mime-mapping>
<mime-mapping>
<extension>bin</extension>
<mime-type>application/octet-stream</mime-type>
</mime-mapping>
<mime-mapping>
<extension>bmp</extension>
<mime-type>image/bmp</mime-type>
</mime-mapping>
<mime-mapping>
<extension>body</extension>
<mime-type>text/html</mime-type>
</mime-mapping>
<mime-mapping>
<extension>cdf</extension>
<mime-type>application/x-cdf</mime-type>
</mime-mapping>
<mime-mapping>
<extension>cer</extension>
<mime-type>application/x-x509-ca-cert</mime-type>
</mime-mapping>
<mime-mapping>
<extension>class</extension>
<mime-type>application/java</mime-type>
</mime-mapping>
<mime-mapping>
<extension>cpio</extension>
<mime-type>application/x-cpio</mime-type>
</mime-mapping>
<mime-mapping>
<extension>csh</extension>
<mime-type>application/x-csh</mime-type>
</mime-mapping>
<mime-mapping>
<extension>css</extension>
<mime-type>text/css</mime-type>
</mime-mapping>
<mime-mapping>
<extension>dib</extension>
<mime-type>image/bmp</mime-type>
</mime-mapping>
<mime-mapping>
<extension>doc</extension>
<mime-type>application/msword</mime-type>
</mime-mapping>
<mime-mapping>
<extension>dtd</extension>
<mime-type>application/xml-dtd</mime-type>
</mime-mapping>
<mime-mapping>
<extension>dv</extension>
<mime-type>video/x-dv</mime-type>
</mime-mapping>
<mime-mapping>
<extension>dvi</extension>
<mime-type>application/x-dvi</mime-type>
</mime-mapping>
<mime-mapping>
<extension>eps</extension>
<mime-type>application/postscript</mime-type>
</mime-mapping>
<mime-mapping>
<extension>etx</extension>
<mime-type>text/x-setext</mime-type>
</mime-mapping>
<mime-mapping>
<extension>exe</extension>
<mime-type>application/octet-stream</mime-type>
</mime-mapping>
<mime-mapping>
<extension>gif</extension>
<mime-type>image/gif</mime-type>
</mime-mapping>
<mime-mapping>
<extension>gtar</extension>
<mime-type>application/x-gtar</mime-type>
</mime-mapping>
<mime-mapping>
<extension>gz</extension>
<mime-type>application/x-gzip</mime-type>
</mime-mapping>
<mime-mapping>
<extension>hdf</extension>
<mime-type>application/x-hdf</mime-type>
</mime-mapping>
<mime-mapping>
<extension>hqx</extension>
<mime-type>application/mac-binhex40</mime-type>
</mime-mapping>
<mime-mapping>
<extension>htc</extension>
<mime-type>text/x-component</mime-type>
</mime-mapping>
<mime-mapping>
<extension>htm</extension>
<mime-type>text/html</mime-type>
</mime-mapping>
<mime-mapping>
<extension>html</extension>
<mime-type>text/html</mime-type>
</mime-mapping>
<mime-mapping>
<extension>hqx</extension>
<mime-type>application/mac-binhex40</mime-type>
</mime-mapping>
<mime-mapping>
<extension>ief</extension>
<mime-type>image/ief</mime-type>
</mime-mapping>
<mime-mapping>
<extension>jad</extension>
<mime-type>text/vnd.sun.j2me.app-descriptor</mime-type>
</mime-mapping>
<mime-mapping>
<extension>jar</extension>
<mime-type>application/java-archive</mime-type>
</mime-mapping>
<mime-mapping>
<extension>java</extension>
<mime-type>text/plain</mime-type>
</mime-mapping>
<mime-mapping>
<extension>jnlp</extension>
<mime-type>application/x-java-jnlp-file</mime-type>
</mime-mapping>
<mime-mapping>
<extension>jpe</extension>
<mime-type>image/jpeg</mime-type>
</mime-mapping>
<mime-mapping>
<extension>jpeg</extension>
<mime-type>image/jpeg</mime-type>
</mime-mapping>
<mime-mapping>
<extension>jpg</extension>
<mime-type>image/jpeg</mime-type>
</mime-mapping>
<mime-mapping>
<extension>js</extension>
<mime-type>text/javascript</mime-type>
</mime-mapping>
<mime-mapping>
<extension>jsf</extension>
<mime-type>text/plain</mime-type>
</mime-mapping>
<mime-mapping>
<extension>jspf</extension>
<mime-type>text/plain</mime-type>
</mime-mapping>
<mime-mapping>
<extension>kar</extension>
<mime-type>audio/x-midi</mime-type>
</mime-mapping>
<mime-mapping>
<extension>latex</extension>
<mime-type>application/x-latex</mime-type>
</mime-mapping>
<mime-mapping>
<extension>m3u</extension>
<mime-type>audio/x-mpegurl</mime-type>
</mime-mapping>
<mime-mapping>
<extension>mac</extension>
<mime-type>image/x-macpaint</mime-type>
</mime-mapping>
<mime-mapping>
<extension>man</extension>
<mime-type>application/x-troff-man</mime-type>
</mime-mapping>
<mime-mapping>
<extension>mathml</extension>
<mime-type>application/mathml+xml</mime-type>
</mime-mapping>
<mime-mapping>
<extension>me</extension>
<mime-type>application/x-troff-me</mime-type>
</mime-mapping>
<mime-mapping>
<extension>mid</extension>
<mime-type>audio/x-midi</mime-type>
</mime-mapping>
<mime-mapping>
<extension>midi</extension>
<mime-type>audio/x-midi</mime-type>
</mime-mapping>
<mime-mapping>
<extension>mif</extension>
<mime-type>application/x-mif</mime-type>
</mime-mapping>
<mime-mapping>
<extension>mov</extension>
<mime-type>video/quicktime</mime-type>
</mime-mapping>
<mime-mapping>
<extension>movie</extension>
<mime-type>video/x-sgi-movie</mime-type>
</mime-mapping>
<mime-mapping>
<extension>mp1</extension>
<mime-type>audio/x-mpeg</mime-type>
</mime-mapping>
<mime-mapping>
<extension>mp2</extension>
<mime-type>audio/x-mpeg</mime-type>
</mime-mapping>
<mime-mapping>
<extension>mp3</extension>
<mime-type>audio/x-mpeg</mime-type>
</mime-mapping>
<mime-mapping>
<extension>mp4</extension>
<mime-type>video/mp4</mime-type>
</mime-mapping>
<mime-mapping>
<extension>mpa</extension>
<mime-type>audio/x-mpeg</mime-type>
</mime-mapping>
<mime-mapping>
<extension>mpe</extension>
<mime-type>video/mpeg</mime-type>
</mime-mapping>
<mime-mapping>
<extension>mpeg</extension>
<mime-type>video/mpeg</mime-type>
</mime-mapping>
<mime-mapping>
<extension>mpega</extension>
<mime-type>audio/x-mpeg</mime-type>
</mime-mapping>
<mime-mapping>
<extension>mpg</extension>
<mime-type>video/mpeg</mime-type>
</mime-mapping>
<mime-mapping>
<extension>mpv2</extension>
<mime-type>video/mpeg2</mime-type>
</mime-mapping>
<mime-mapping>
<extension>ms</extension>
<mime-type>application/x-wais-source</mime-type>
</mime-mapping>
<mime-mapping>
<extension>nc</extension>
<mime-type>application/x-netcdf</mime-type>
</mime-mapping>
<mime-mapping>
<extension>oda</extension>
<mime-type>application/oda</mime-type>
</mime-mapping>
<mime-mapping>
<!– OpenDocument Database –>
<extension>odb</extension>
<mime-type>application/vnd.oasis.opendocument.database</mime-type>
</mime-mapping>
<mime-mapping>
<!– OpenDocument Chart –>
<extension>odc</extension>
<mime-type>application/vnd.oasis.opendocument.chart</mime-type>
</mime-mapping>
<mime-mapping>
<!– OpenDocument Formula –>
<extension>odf</extension>
<mime-type>application/vnd.oasis.opendocument.formula</mime-type>
</mime-mapping>
<mime-mapping>
<!– OpenDocument Drawing –>
<extension>odg</extension>
<mime-type>application/vnd.oasis.opendocument.graphics</mime-type>
</mime-mapping>
<mime-mapping>
<!– OpenDocument Image –>
<extension>odi</extension>
<mime-type>application/vnd.oasis.opendocument.image</mime-type>
</mime-mapping>
<mime-mapping>
<!– OpenDocument Master Document –>
<extension>odm</extension>
<mime-type>application/vnd.oasis.opendocument.text-master</mime-type>
</mime-mapping>
<mime-mapping>
<!– OpenDocument Presentation –>
<extension>odp</extension>
<mime-type>application/vnd.oasis.opendocument.presentation</mime-type>
</mime-mapping>
<mime-mapping>
<!– OpenDocument Spreadsheet –>
<extension>ods</extension>
<mime-type>application/vnd.oasis.opendocument.spreadsheet</mime-type>
</mime-mapping>
<mime-mapping>
<!– OpenDocument Text –>
<extension>odt</extension>
<mime-type>application/vnd.oasis.opendocument.text</mime-type>
</mime-mapping>
<mime-mapping>
<extension>ogg</extension>
<mime-type>application/ogg</mime-type>
</mime-mapping>
<mime-mapping>
<!– OpenDocument Drawing Template –>
<extension>otg </extension>
<mime-type>application/vnd.oasis.opendocument.graphics-template</mime-type>
</mime-mapping>
<mime-mapping>
<!– HTML Document Template –>
<extension>oth</extension>
<mime-type>application/vnd.oasis.opendocument.text-web</mime-type>
</mime-mapping>
<mime-mapping>
<!– OpenDocument Presentation Template –>
<extension>otp</extension>
<mime-type>application/vnd.oasis.opendocument.presentation-template</mime-type>
</mime-mapping>
<mime-mapping>
<!– OpenDocument Spreadsheet Template –>
<extension>ots</extension>
<mime-type>application/vnd.oasis.opendocument.spreadsheet-template </mime-type>
</mime-mapping>
<mime-mapping>
<!– OpenDocument Text Template –>
<extension>ott</extension>
<mime-type>application/vnd.oasis.opendocument.text-template</mime-type>
</mime-mapping>
<mime-mapping>
<extension>pbm</extension>
<mime-type>image/x-portable-bitmap</mime-type>
</mime-mapping>
<mime-mapping>
<extension>pct</extension>
<mime-type>image/pict</mime-type>
</mime-mapping>
<mime-mapping>
<extension>pdf</extension>
<mime-type>application/pdf</mime-type>
</mime-mapping>
<mime-mapping>
<extension>pgm</extension>
<mime-type>image/x-portable-graymap</mime-type>
</mime-mapping>
<mime-mapping>
<extension>pic</extension>
<mime-type>image/pict</mime-type>
</mime-mapping>
<mime-mapping>
<extension>pict</extension>
<mime-type>image/pict</mime-type>
</mime-mapping>
<mime-mapping>
<extension>pls</extension>
<mime-type>audio/x-scpls</mime-type>
</mime-mapping>
<mime-mapping>
<extension>png</extension>
<mime-type>image/png</mime-type>
</mime-mapping>
<mime-mapping>
<extension>pnm</extension>
<mime-type>image/x-portable-anymap</mime-type>
</mime-mapping>
<mime-mapping>
<extension>pnt</extension>
<mime-type>image/x-macpaint</mime-type>
</mime-mapping>
<mime-mapping>
<extension>ppm</extension>
<mime-type>image/x-portable-pixmap</mime-type>
</mime-mapping>
<mime-mapping>
<extension>ppt</extension>
<mime-type>application/vnd.ms-powerpoint</mime-type>
</mime-mapping>
<mime-mapping>
<extension>pps</extension>
<mime-type>application/vnd.ms-powerpoint</mime-type>
</mime-mapping>
<mime-mapping>
<extension>ps</extension>
<mime-type>application/postscript</mime-type>
</mime-mapping>
<mime-mapping>
<extension>psd</extension>
<mime-type>image/x-photoshop</mime-type>
</mime-mapping>
<mime-mapping>
<extension>qt</extension>
<mime-type>video/quicktime</mime-type>
</mime-mapping>
<mime-mapping>
<extension>qti</extension>
<mime-type>image/x-quicktime</mime-type>
</mime-mapping>
<mime-mapping>
<extension>qtif</extension>
<mime-type>image/x-quicktime</mime-type>
</mime-mapping>
<mime-mapping>
<extension>ras</extension>
<mime-type>image/x-cmu-raster</mime-type>
</mime-mapping>
<mime-mapping>
<extension>rdf</extension>
<mime-type>application/rdf+xml</mime-type>
</mime-mapping>
<mime-mapping>
<extension>rgb</extension>
<mime-type>image/x-rgb</mime-type>
</mime-mapping>
<mime-mapping>
<extension>rm</extension>
<mime-type>application/vnd.rn-realmedia</mime-type>
</mime-mapping>
<mime-mapping>
<extension>roff</extension>
<mime-type>application/x-troff</mime-type>
</mime-mapping>
<mime-mapping>
<extension>rtf</extension>
<mime-type>application/rtf</mime-type>
</mime-mapping>
<mime-mapping>
<extension>rtx</extension>
<mime-type>text/richtext</mime-type>
</mime-mapping>
<mime-mapping>
<extension>sh</extension>
<mime-type>application/x-sh</mime-type>
</mime-mapping>
<mime-mapping>
<extension>shar</extension>
<mime-type>application/x-shar</mime-type>
</mime-mapping>
<!–
<mime-mapping>
<extension>shtml</extension>
<mime-type>text/x-server-parsed-html</mime-type>
</mime-mapping>
–>
<mime-mapping>
<extension>smf</extension>
<mime-type>audio/x-midi</mime-type>
</mime-mapping>
<mime-mapping>
<extension>sit</extension>
<mime-type>application/x-stuffit</mime-type>
</mime-mapping>
<mime-mapping>
<extension>snd</extension>
<mime-type>audio/basic</mime-type>
</mime-mapping>
<mime-mapping>
<extension>src</extension>
<mime-type>application/x-wais-source</mime-type>
</mime-mapping>
<mime-mapping>
<extension>sv4cpio</extension>
<mime-type>application/x-sv4cpio</mime-type>
</mime-mapping>
<mime-mapping>
<extension>sv4crc</extension>
<mime-type>application/x-sv4crc</mime-type>
</mime-mapping>
<mime-mapping>
<extension>svg</extension>
<mime-type>image/svg+xml</mime-type>
</mime-mapping>
<mime-mapping>
<extension>svgz</extension>
<mime-type>image/svg+xml</mime-type>
</mime-mapping>
<mime-mapping>
<extension>swf</extension>
<mime-type>application/x-shockwave-flash</mime-type>
</mime-mapping>
<mime-mapping>
<extension>t</extension>
<mime-type>application/x-troff</mime-type>
</mime-mapping>
<mime-mapping>
<extension>tar</extension>
<mime-type>application/x-tar</mime-type>
</mime-mapping>
<mime-mapping>
<extension>tcl</extension>
<mime-type>application/x-tcl</mime-type>
</mime-mapping>
<mime-mapping>
<extension>tex</extension>
<mime-type>application/x-tex</mime-type>
</mime-mapping>
<mime-mapping>
<extension>texi</extension>
<mime-type>application/x-texinfo</mime-type>
</mime-mapping>
<mime-mapping>
<extension>texinfo</extension>
<mime-type>application/x-texinfo</mime-type>
</mime-mapping>
<mime-mapping>
<extension>tif</extension>
<mime-type>image/tiff</mime-type>
</mime-mapping>
<mime-mapping>
<extension>tiff</extension>
<mime-type>image/tiff</mime-type>
</mime-mapping>
<mime-mapping>
<extension>tr</extension>
<mime-type>application/x-troff</mime-type>
</mime-mapping>
<mime-mapping>
<extension>tsv</extension>
<mime-type>text/tab-separated-values</mime-type>
</mime-mapping>
<mime-mapping>
<extension>txt</extension>
<mime-type>text/plain</mime-type>
</mime-mapping>
<mime-mapping>
<extension>ulw</extension>
<mime-type>audio/basic</mime-type>
</mime-mapping>
<mime-mapping>
<extension>ustar</extension>
<mime-type>application/x-ustar</mime-type>
</mime-mapping>
<mime-mapping>
<extension>vxml</extension>
<mime-type>application/voicexml+xml</mime-type>
</mime-mapping>
<mime-mapping>
<extension>xbm</extension>
<mime-type>image/x-xbitmap</mime-type>
</mime-mapping>
<mime-mapping>
<extension>xht</extension>
<mime-type>application/xhtml+xml</mime-type>
</mime-mapping>
<mime-mapping>
<extension>xhtml</extension>
<mime-type>application/xhtml+xml</mime-type>
</mime-mapping>
<mime-mapping>
<extension>xls</extension>
<mime-type>application/vnd.ms-excel</mime-type>
</mime-mapping>
<mime-mapping>
<extension>xml</extension>
<mime-type>application/xml</mime-type>
</mime-mapping>
<mime-mapping>
<extension>xpm</extension>
<mime-type>image/x-xpixmap</mime-type>
</mime-mapping>
<mime-mapping>
<extension>xsl</extension>
<mime-type>application/xml</mime-type>
</mime-mapping>
<mime-mapping>
<extension>xslt</extension>
<mime-type>application/xslt+xml</mime-type>
</mime-mapping>
<mime-mapping>
<extension>xul</extension>
<mime-type>application/vnd.mozilla.xul+xml</mime-type>
</mime-mapping>
<mime-mapping>
<extension>xwd</extension>
<mime-type>image/x-xwindowdump</mime-type>
</mime-mapping>
<mime-mapping>
<extension>vsd</extension>
<mime-type>application/x-visio</mime-type>
</mime-mapping>
<mime-mapping>
<extension>wav</extension>
<mime-type>audio/x-wav</mime-type>
</mime-mapping>
<mime-mapping>
<!– Wireless Bitmap –>
<extension>wbmp</extension>
<mime-type>image/vnd.wap.wbmp</mime-type>
</mime-mapping>
<mime-mapping>
<!– WML Source –>
<extension>wml</extension>
<mime-type>text/vnd.wap.wml</mime-type>
</mime-mapping>
<mime-mapping>
<!– Compiled WML –>
<extension>wmlc</extension>
<mime-type>application/vnd.wap.wmlc</mime-type>
</mime-mapping>
<mime-mapping>
<!– WML Script Source –>
<extension>wmls</extension>
<mime-type>text/vnd.wap.wmlscript</mime-type>
</mime-mapping>
<mime-mapping>
<!– Compiled WML Script –>
<extension>wmlscriptc</extension>
<mime-type>application/vnd.wap.wmlscriptc</mime-type>
</mime-mapping>
<mime-mapping>
<extension>wmv</extension>
<mime-type>video/x-ms-wmv</mime-type>
</mime-mapping>
<mime-mapping>
<extension>wrl</extension>
<mime-type>x-world/x-vrml</mime-type>
</mime-mapping>
<mime-mapping>
<extension>wspolicy</extension>
<mime-type>application/wspolicy+xml</mime-type>
</mime-mapping>
<mime-mapping>
<extension>Z</extension>
<mime-type>application/x-compress</mime-type>
</mime-mapping>
<mime-mapping>
<extension>z</extension>
<mime-type>application/x-compress</mime-type>
</mime-mapping>
<mime-mapping>
<extension>zip</extension>
<mime-type>application/zip</mime-type>
</mime-mapping>
<!– ==================== Default Welcome File List ===================== –>
<!– When a request URI refers to a directory, the default servlet looks –>
<!– for a “welcome file” within that directory and, if present, –>
<!– to the corresponding resource URI for display. If no welcome file –>
<!– is present, the default servlet either serves a directory listing, –>
<!– or returns a 404 status, depending on how it is configured. –>
<!– –>
<!– If you define welcome files in your own application’s web.xml –>
<!– deployment descriptor, that list *replaces* the list configured –>
<!– here, so be sure that you include any of the default values that –>
<!– you wish to include. –>
<!– index.html????? start –>
<welcome-file-list>
<welcome-file>index.html</welcome-file>
<welcome-file>index.htm</welcome-file>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
<!– index.html????? end –>
<!– ??vue-cli??router??????? start –>
<error-page>
<exception-type>java.lang.Throwable</exception-type>
<location>/index.html</location>
</error-page>
<error-page>
<error-code>500</error-code>
<location>/index.html</location>
</error-page>
<error-page>
<error-code>404</error-code>
<location>/index.html</location>
</error-page>
<error-page>
<error-code>405</error-code>
<location>/index.html</location>
</error-page>
<!– ??vue-cli??router??????? end –>
</web-app>
3.将前端内容放在webapps下的根目录文件内即可
5.登录(自动登录,手机号登录)
登录后要将token保存到localStorage
let info = {token: Token}
localStorage.setItem('key', JSON.stringify(info))
获取localStorage内的值
let KEY = localStorage.getItem('key')
let _token = JSON.parse(KEY).token
6.微信支付(根据后端提供的接口)
支付校验 —-微信支付接口—–流水订单保存—–支付结果保存—–支付成功页面
7.避免微信端分享
window.onload = function () {
function onBridgeReady () {
WeixinJSBridge.call('hideToolbar')
WeixinJSBridge.call('hideOptionMenu')
}
if (document.addEventListener) {
document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false)
} else if (document.attachEvent) {
document.attachEvent('WeixinJSBridgeReady', onBridgeReady)
document.attachEvent('onWeixinJSBridgeReady', onBridgeReady)
}
}
8.微信中浏览器自带返回按钮的控制
beforeRouteLeave (to, from, next) {
/* eslint-disable no-new */
if (to.name === 'aa') { //aa 为router里的name名字
this.Log('请点击关闭,关闭页面')
next(false)
} else {
next()
}
}
// 此功能是当本页是从name为aa页面进来时,点击返回为弹框提示自己关闭本页面,否则该页面其他部分点击还是去该去的地方
a: 将post请求的params替换为data
b: 安装qs
10. axios请求接口 跨域才会请求两次,否则只请求一次
当跨域时避免请求两次的方法是:config配置文件中有两个参数注释掉即可
// onUploadProgress: function(progressEvent) {
// // Do whatever you want with the native progress event
// },
// onDownloadProgress: function(progressEvent) {
// // Do whatever you want with the native progress event
// },
原创文章,作者:余 倩倩,如若转载,请注明出处:https://www.pmtemple.com/h5/1125/



微信扫一扫
支付宝扫一扫
评论列表(12条)
Vue项目部署经验超实用!作为品牌主理人,之前一直苦于产品展示页面管理,这些前端技巧太有用了。webpack打包和tomcat部署简直是救星,终于不用再请IT小哥帮忙上线新品了~
Vue2项目经验总结很实用,特别是Tomcat部署的base路径配置解决了刷新404问题。作为产品经理,我认为技术选型时还应考虑团队熟悉度和长期维护成本,Vue2到Vue3的迁移路径也值得提前规划。
哇!Vue2做13页项目就像小游戏开发一样(◕ᴗ◕✿) 作为游戏策划,最喜欢这种麻雀虽小五脏齐全的项目!不过好奇打包后的dist文件在游戏服务器部署会不会有问题?之前我们游戏页面部署遇到过兼容性问题呢~
小项目也能练好基本功,就像健身先打好基础。Vue的filter和webpack配置就像正确的训练动作,细节决定成败。开发效率提升,产品体验才能升级,坚持就是胜利!
@铁血观察者:Vue小项目五脏俱全,这MVP思维很到位!filter和webpack配置确实像基本功,就像Git提交规范一样重要。不过现在Vue3的组合式API感觉更优雅,filter也能用computed属性替代,代码复用性直接拉满!
@字节思想家:作为一个旅行摄影师,深有体会!小项目就像拍摄一组旅行小景,麻雀虽小五脏俱全,每个功能模块都要精心打磨。filter的使用就像照片后期处理,细节决定成败!📸 祝项目顺利上线!
这个小项目就像我旅行中发现的”精致民宿”,虽小却五脏俱全,处处都是精心设计的细节!Vue的filter功能就像我镜头前的滤镜,能将原始数据转化为更有意义的画面。打包部署的过程就像整理摄影器材,每个步骤都要精准到位才能让作品完美呈现。📸✨
Vue项目虽然麻雀小五脏全,这让我想起摄影创作!📸 有时候最简单的作品反而需要最扎实的技术基础。每个功能都像是摄影中的构图、用光,需要精心打磨才能呈现完美效果。项目部署就像作品发布,终于可以展示自己的成果啦!
技术细节很实用,但产品思维更重要。Vue项目如麻雀虽小,五脏俱全,关键在于取舍。技术选型应服务于产品目标,而非过度设计。简洁是最高级的复杂。
哇!Vue这麻雀虽小五脏俱全的感觉好适合小游戏项目啊!作为游戏策划,看到
@次元次元:这篇文章对Vue2项目部署的总结很实用!特别是关于Tomcat环境下解决刷新404问题的配置,这种细节正是产品开发中容易忽略却至关重要的部分。作为产品研究者,我觉得项目中的”五脏俱全”概念很贴切,小项目也能体现完整的产品思维和技术栈考量。
Vue项目虽小但五脏俱全,就像我的摄影器材一样�