我正在使用dojo 1.9.3。我在使用build.bat构建dojo时遇到css文件中的问题。这是我的css文件代码:
@import url("TimeDriverCommon.css");
@import url("DialogCommon.css");
@import url( "timedriver/Dialog.css" );
@import url( "timedriver/Help.css" );
@import url( "timedriver/Blocker.css" );
@import url( "timedriver/dialogs/SendMessage.css" );
@import url( "timedriver/layout/BorderContainer.css" );
@import url( "timedriver/form/RadioButton.css" );
@import url( "timedriver/PasswordStrength.css" );
@import url( "timedriver/invitee/wizard.css" );
@import url( "timedriver/invitee/AddToCalendar.css" );
@import url( "timedriver/invitee/ApptDetails.css" );
@import url( "timedriver/invitee/Error.css" );
@import url( "timedriver/invitee/ProvideInformation.css" );
@import url( "timedriver/invitee/SelectDate.css" );
@import url( "timedriver/invitee/booking/BookingStep.css" );
@import url( "timedriver/invitee/booking/Confirmation.css" );
@import url( "timedriver/invitee/booking/Welcome.css" );
/***** MAIN CONTENT *****/
#headerArea {
height: 72px; /* to accommodate logo */
overflow: hidden;
background-color: white/*#BAD0E2*/;
max-width: 1012px;
margin: 0 auto; /* center */
position: relative; /* need offset origin for headerNonLogoAreas (e.g. gradient) */
font-size: 85%;
}
.psNoHeader #headerArea {
display: none;
}
html {
overflow: hidden;
}
body {
background-image: url('/td/_images/mainGradient.jpg');
background-repeat: repeat-x;
background-position: 0 -220px;
background-color: #8A90A0;
}
.dj_ie6 #headerArea {
width: expression((document.body.offsetWidth > 1012 ? 1012 : document.body.offsetWidth) + "px");
}
#bodyArea {
position: absolute;
top: 72px; /* same as headerArea height */
bottom: 0;
width: 100%;
overflow: hidden;
font-size: 85%;
}
.psNoHeader #bodyArea {
top: 0;
}
/* IE 6 & 7 work-around for box offset positioning */
.dj_ie6 #bodyArea,
.dj_ie7 #bodyArea {
bottom: ;
height: expression(document.body.offsetHeight - 72 + "px"); /* 72 = height of header */
}
#scrollingArea {
background-color: white;
margin: 0 auto; /* center */
max-width: 1012px;
height: 100%;
position: relative; /* IE 6 needs this to keep the scroll bas above the position:absolute content! */
}
/* IE 6 workaround for lack of max-width support */
.dj_ie6 #scrollingArea {
width: expression((document.body.offsetWidth > 1012 ? 1012 : document.body.offsetWidth) + "px");
overflow: auto;
}
.leftpanel {
left: 25px;
width: 666px;
position: absolute;
top: 0;
}
.rightpanel {
position: absolute;
top: 1.75em; /* this must match the combined top of .leftpanel and height of .wizardheader */
right: 25px;
width: 272px;
}
.rightpanel .brandingLinks {
margin-left: 15px;
padding-top: 20px;
text-align: left;
color:gray;
}
.rightpanel #sendMessageLink {
display: block;
margin-bottom: 10px;
}
.brandingContainer {
text-align: center;
}
.brandingLinks {
text-align: left;
}
.logoContainer #logoContainerImg {
margin-left: 15px;
}
.headerNonLogoArea {
bottom:4px;
display:block;
height:100%;
padding-left:190px;
position:absolute;
right:5px;
}
#headerGradient {
width: 100%;
height: 100%;
position: absolute;
}
.headerActionArea {
float: right;
text-align: right;
margin-right: 5px;
margin-top: 5px;
}
.headerIdentificationArea {
position: absolute;
bottom: 4px;
right: 5px;
margin-right: 15px;
/*color: #ffffff;*/
}
.ttLogo {
position: absolute;
left: 6px;
top: 1px;
width: 177px;
}
/***** END MAIN CONTENT *****/
/***** COMMON STYLES *****/
.copyright {
/* we're not currently showing copyrights on the booking side */
display: none;
}
.bold {
font-weight: bold;
}
/***** START 'Send Message Dialog (Wizard)' *****/
#dialogSendMessage {
width: 575px;
}
#dialogSendMessage .header {
font-weight: bold;
padding: 10px;
font-size: 100%;
background-color: #E7EBF3;
border-bottom: 2px solid #CBD6DB;
color: #585757;
}
#dialogSendMessage .content {
padding: 10px;
background-color: #ffffff;
line-height: 20px;
position: relative;
font-size: 90%;
}
#dialogSendMessage .footer {
text-align: right;
line-height: 35px;
background-color: #E7EBF3;
border-top: 2px solid #CBD6DB;
}
/***** STOP 'Send Message Dialog (Wizard)' *****/
/*
* This is really effed up, but dojo uses blockquote tags to format indents in the Editor.
* Therefore, we need to style them similarly in our app.
*/
.timedriver blockquote {
border: 0 none;
font-size: inherit;
line-height: inherit;
padding: 0;
margin: 1em 0 1em 40px; /* it seems that this really should be pixels, not 2.5em as I would expect (legacy from Netscape/IE) */
}
.timedriver .videoContainer {
position: relative;
height: 120px;
-moz-border-radius:6px 6px 6px 6px;
-webkit-border-radius: 6px;
border-radius: 6px;
border:6px solid #F3F3F5;
}
.timedriver .videoListLeftBar {
border-left:1px solid #E8AB1D;
border-top:1px solid #E8AB1D;
bottom:9px;
left:11px;
position:absolute;
top:23px;
width:15px;
}
.timedriver .videoContainerConfirmation {
height: 220px;
}
.timedriver .videoContainerConfirmation .videoListLeftBar{
top: 60px;
}
.timedriver .learnMore {
color:blue;
font-weight:bold;
margin:15px 37px;
}
.timedriver .learnMore img{
display:block;
margin:10px 40px;
border: none;
}
.timedriver .videoListRight {
position:absolute;
left:25px;
top:9px;
}
.timedriver .videoContainerConfirmation .videoListRight {
top: 29px;
}
.timedriver .videoListRight .videoArrow {
height:29px;
width:29px;
display: block;
}
.timedriver .videoListRight p {
color:blue;
display:inline-block;
font-weight:bold;
margin:-25px 0 0 37px;
vertical-align:top;
width:180px;
}
.timedriver .videoLinks {
position: absolute;
top: 45px;
left: 30px;
}
.timedriver .videoLinks img {
height:13px;
margin-right:10px;
vertical-align:middle;
width:11px;
}
.timedriver #videoConfirmationBlock {
margin-top: 18px;
}
.timedriver #videoConfirmationBlock .videoContainerConfHeader {
color: red;
font-weight: normal;
position: absolute;
top: 5px;
left: -50px;
}
.psNoHeader .bottonPanel {
display: none;
}
.bottonPanel {
color:black;
font-size:10px;
font-style:italic;
position: relative;
top: 14px;
right: 5px;
width: 100%;
text-align: right;
clear: both;
}
.dj_ie7 .bottonPanel, .dj_ie6 .bottonPanel {
position: relative;
top: 10px;
}
.bottonPanel a{
color:#557EAD;
font-family:Helvetica;
font-size:10px;
font-style:italic;
font-weight:bold;
text-decoration:none;
}
.psNoHeader .poweredBy {
display: block!important;
color:black;
font-size:10px;
font-style:italic;
position: absolute;
}
.dj_ie7 .psNoHeader .poweredBy {
bottom: -10px;
}
.psNoHeader .errorcontainer .poweredBy {
bottom: -10px;
}
.dj_ie7 .psNoHeader .errorcontainer .poweredBy {
bottom: 0;
}
.psNoHeader .poweredBy a {
color:#557EAD;
font-family:Helvetica;
font-size:10px;
font-style:italic;
font-weight:bold;
text-decoration:none;
}
它给了我以下错误:
[exec] error(307) Failed to evaluate module tagged as pure AMD (fell back to processing with regular expressions). module: timetrade/themes/TimeDriverBooking.css; error: SyntaxError: missing name after .@
这个问题的原因是什么?
答案 0 :(得分:1)
您需要适当设置timetrade / package.json和timetrade / timetrade.profile.js以将CSS文件标记为copyOnly - 而不是AMD。
可以在dojo源代码树中找到一个很好的示例 - 请参阅dijit / package.json,dijit / dijit.profile.js。请注意package.json如何指向dijit.profile.js文件,以便为dojo构建系统提供有关如何构建程序包的说明。
另请参阅构建系统文档 - http://dojotoolkit.org/reference-guide/1.10/build/buildSystem.html#build-buildsystem